6.23学习笔记

1、选择器E:hover. E:active和E:focus
1). E:hover选择器被用来指冠当鼠标指针移动到元素上时元素所使用的样式
使用方法:
<元素>:hover{
CSS样式
}
我们可以在“<元素>”中添加元素的type属性。
例:
input[type=“text”]:hover{
CSS样式
}
2). E:active选择器被用来指定元素被激活时使用的样式
3). E:focus选择器被用来指定元素获得光标聚焦点使用的样式。主要是在文本框控件获得
聚焦点并进行文字输入时使用。
4)、小案例:
结合.上诉实现以下效果，当鼠标移动上去是文本框变成绿色，当鼠标点击时(点击并未谈起
）文本框处于蓝色，当处于可输入状态时文本框变成橙色。
例子

选择器E:hover、E:active和E:focus

姓名:

密码:

2、E:eniabled伪类选择器与E:disabled伪类选择器
1). E:enabled选择 器被用来指定当元素处于可用状态时的样式。
2)、E:disabled选择 器被用来指定当元素处于不可用状态时的样式。
余昂中
3)、小案例: .
结合.上诉实现以下效果，文本框可用时背景颜色绿色，不可用时背景变成浅灰色。

3. E:read-only伪类选择器与E:read-write伪类选择器
   1). E:read-only选择 器被用来指定当元素处于只读状态时的样式。
   2)、E:read-write选择器被用来指定当元素处于非只读状态时的样式。
   3)、小案例:
   结合上诉实现以下效果，文本框可用时输入文字变成紅色，不可用时，设置里面的背景为黑
   色，文字为绿色。

4、伪类选择器E:checked. E:default和indeterminate
1)、E:cehcked伪类选择器用来指定当表单中的radio单选框或者是checkbox复选框处于
取状态时的样式。
2). E:default选择 器用来指定当页面打开时默认处于选取状态的单选框或复选框的控件的
样式。
3)、E:indeterminate选择 器用来指定当页面打开时，-组单选框中没有任何一个单选框被
设定为选中状态时，整组单选框的样式。

5、伪类选择器E::selection
1)、E:selection伪类选择器用来指定当元素处于选中状态时的样式。
2).小案例:
选择网页中p段落中的文字和文本框中的文字，改变他的背景颜色为绿色!

6、E:invalid伪类选择器与E:valid伪类选择器
1). E:invalid伪类选择器用来指定， 当元素内容不能通过HTML5通过使用的元素的诸如
requirde等属性所指定的检查或元素内容不符合元素规定的格式时的样式。
2). E:valid伪类 选择器用来指定，当元素内容能通过HTML 5通过使用的元素的诸如
requirde等属性所指定的检查或元素内容符合元素规定的格式时的样式。
例子：

<!DOCT YPE html>

E:invalid伪类选择器与E:valld伪类选择器

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伪类选择器用来指定当元素的有效值被限定在一段范围之内， 且实际的输入
值在该范围之内时的样式。
2). E:out-of-range伪类选择器用来指定当元素的有效值被限定在一段范围之内， 但实际
输入值在超过时使用的样式。

通用兄弟元素选择器
他用来指定位于同父元素之中的某个元素之后的所有其他某个种类的兄弟元素所使用的
样式。
使用方法:
<子元素>~<之元素之后的同级兄弟元素>{
CSS样式
}