注册 | 登陆
您的位置:阿里西西 > 前端技术 > CSS教程 > 详细内容

CSS3实例教程:hover、active和:focus伪选择器

  稿源:互联网   2012-08-03 10:10:48   点击:   撤稿纠错

以下讨论的是和相关的CSS3实例教程:hover、active和:focus伪选择器 教程文章,内容是本站精心挑选整理的教程,希望对广大的网友给到帮助,下面是详细内容:

文章简介:CSS3实例教程:hover、active和:focus伪选择器。

CSS3的伪类选择器就是多,今天我们来学习新的伪类选择器——UL状态伪类选择器。这些选择器都有一个共同的特征名那就是定义的样式只有当元素处于某种状态下时才起作用,在默认状态下无效。

  今天我们先来接触:hover、active和:focus这三种状态伪类选择器。


:hover选择器、:active选择器和:focus选择器
  :hover选择器:当鼠标悬停在所指定的元素上时所使用的样式;
  :active选择器:当所指定的元素处于激活状态(鼠标在元素上按下还没有松开)时所使用的样式;
  :focus选择器:当元素获得光标焦点时使用的样式,主要用在文本框输入文字时使用;
  【注】下方案例运行效果,之所以点击后立即变为绿色是因为active触发的同时focus也触发了,所以active定义的样式看似无效,大家可以先把focus定义的样式注释掉运行;


 

 
   
 
       
 
        CSS3实例教程:hover、active和:focus伪选择器——网页教学网webjx.com
 
       
 
   
 
   
   
 
      


     
                 

  •  
                   
     
                      
     
                 

  •  
                 

  •  
                   
     
                      
     
                 

  •  
             

 
   
 


关于CSS3实例教程:hover、active和:focus伪选择器的内容写到这里就结束啦,您可以收藏本页网址http://www.alixixi.com/web/ a/2012080382658.shtml方便下次再访问哦。