JavaScript开发者必知：CSS3新增伪类实例大揭秘

CSS3新增了许多伪类，以下是一些常见的例子： 1. :hover：当用户将鼠标悬停在一个元素上时，该元素会应用伪类样式。 例如： ```css a:hover { color: red; } ``` 在这个例子中，当用户将鼠标悬停在链接上时，链接的颜色会变为红色。 2. :active：当用户点击一个元素时，该元素会应用伪类样式。 例如： ```css a:active { color: blue; } ``` 在这个例子中，当用户点击链接时，链接的颜色会变为蓝色。 3. :focus：当元素获得焦点时，该元素会应用伪类样式。 例如： ```css input:focus { border: 2px solid green; } ``` 在这个例子中，当用户将焦点移动到输入框上时，输入框的边框会变为绿色。 4. :visited：当用户点击一个已访问的链接时，该链接会应用伪类样式。 例如： ```css a:visited { color: purple; } ``` 在这个例子中，当用户点击已访问的链接时，链接的颜色会变为紫色。 5. :nth-child()：用于选择特定的子元素。 例如： ```css li:nth-child(even) { background-color: lightgray; } ``` 在这个例子中，所有偶数索引的列表项的色会变为浅灰色。 6. :nth-of-type()：用于选择特定类型的子元素。 例如： ```css p:nth-of-type(2) { font-weight: bold; } ``` 在这个例子中，第二个段落的字体加粗。 ######[AI写代码神器 | 354点数解答 | 2023-11-09 01:00:11]