超级选择器

1.选择器E:hover、E:acrive和E:focus

1)E:hover选择器被用来指定当鼠标指针移动到元素上时元素所使用的样式

使用方法:

<元素>:hover{

  CSS样式

}

们可以在“<元素>”中添加元素的type属性

例:

input[type="样式"]:hover{

  CSS样式

}

2)E:active选择器被用来指定元素被激活时使用的样式

3)E:focus选择器被用来指定元素获得光标聚焦点使用的样式,主要是在文本框控件获得聚焦点并进行文字输入时使用

2.E:enabled伪类选择器与E:disabled伪类选择器

1)E:enabled选择器用来指定当元素处于可用状态时的样式。

2)E:disabled选择器用来指定当元素处于不可用状态时的样式。

3.E:read-only伪类选择器与E:read-write伪类选择器

1)E:read-only选择器用来指定当元素处于只读状态时的样式。

2)E:read-write选择器用来指定当元素处于非只读状态时的样式。

4.伪类选择器E:checked、E:default和indeterminate

1)E:read-only选择器用来指定当表单中的radio单选框或者是CheckBox复选框处于选取状态时的样式。

2)E:default选择器用来指定当页面打开时默认处于选取状态的复选框或复选框的控件的样式。

3)E:indeterminate选择器用来指定当页面打开时,一组单选框中没有任何一个单选框被设定为选中状态时,整组单选框的样式。

5.伪类选择器E:selection

1)E:selection选择器用来指定当元素处于选中状态时的样式。

6.伪类选择器E:invalid与伪类选择器E:valid

1)E:invalid选择器用来指定当元素内容不能通过HTML5使用的元素诸如requirde等属性指定的检查或者元素内容不符合元素规定的格式时的样式。

2)E:valid选择器用来指定当元素内容能通过HTML5使用的元素诸如requirde等属性指定的检查或者元素内容符合元素规定的格式时的样式。

如:通过E-mail属性的表单判断输入是否正确,正确输入格式的内容为绿色,输入错误格式就是红色!

7.伪类选择器E:required与伪类选择器E:optional

1)E:required伪类选择器用来指定允许使用required属性,而且已经指定了required属性的input元素、select元素以及textarea元素的样式。

2)E:optional伪类选择器用来指定允许使用required属性,而且未指定了required属性的input元素、select元素以及textarea元素的样式。

例:必填表单背景为红色,可选表单背景绿色

8.伪类选择器E:in-range与伪类选择器E:out-of-range伪类选择器

1)E:in-range伪类选择器用来指定当元素的有效值被限定在一段范围之内,且实际的输入值在该范围之内时的样式。

1)E:out-of-range伪类选择器用来指定当元素的有效值被限定在一段范围之内,但实际的输入值在超过时使用的样式。

例:0-100以内的数字,小于0或者超过100,字体变成红色,否则变成绿色。

通用兄弟元素选择器

用来指定位于同一个父元素之中的某个元素之后的所有其他某个种类的兄弟元素所使用的样式。

使用方法:

<子元素>~<子元素之后的同级兄弟元素>{

  CSS样式

posted @ 2019-03-13 16:39  YamLilac  阅读(115)  评论(0编辑  收藏  举报