CSS3学习笔记2：UI元素状态伪类选择器

第3节.UI元素状态伪类选择器

Part I 这种选择器的共同特征：

         指定的样式只有当元素处于某种状态时才起作用，在默认状态下不起作用

         CSS3中共有11种UI元素状态伪类选择器：

             E:hover        |  E:active     |  E:focus  |  E:enable  |  E:disable   

             E:read-only   |  E:read-write   

             E:checked     |  E:default    |  E:indeterminate  |  E::selection

 -------------------------------------------------------------------------------------------------------

Part II 使用方法：（见例）

         <style>    

         input[type="text"]:hover{样式;}   //鼠标指针移动到某个文本框控件上的样式    

         input[type="text"]:focus{样式;}   //文本框控件被激活时的样式    

         input[type="text"]:active{样式;}  //文本框控件获得光标焦点后的样式

         </style>

 --------------------------------------------------------------------------------------------------------

Part III 详细说明：   

         1.  E:hover  鼠标指针移动到某个文本框控件上的样式；   

         2.  E:active 元素被激活(鼠标在元素上按下还没有松开)时使用的样式；   

         3.  E:focus  元素获得光标焦点时使用的样式，主要是在文本框控件获得焦点并进行文字输入的时候使用；      

         4.  E:enable  指定当元素处于可用状态时的样式；   

         5.  E:disable 指定当元素处于不可用状态时的样式；       

         6.  E:read-only  指定当元素处于只读状态时的样式；   

         7.  E:read-write 指定当元素处于非只读状态时的样式；      

            注：在FF下要写成 -moz-read-only 或者 -moz-read-write      

            例：<style>  

                  input[type="text"]:read-only{...}   

                  input[type="text"]:read-write{...}   

                  input[type="text"]:-moz-read-only{...}    //针对FF而写   

                  input[type="text"]:-moz-read-write{...}   //针对FF而写          

                 </style>

          8.  E:checked  指定当表单中的radio单选框或checkbox复选框处于选取状态时的样子(FF中要写成：-moz-checked)；   

          9.  E:default  指定当页面打开时默认处于选区状态的radio或checkbox控件的样式；   

          10.E:indeterminate  指定当页面打开时，如果一组单选框中任何一个单选框都没有被设定为选取状态时整组单选框的

              样式，如果用户选取了一个单选框，则该样式被取消   

          11.E::selection  指定当元素处于选中状态时的样式；