/*链接伪类选择器*/ a:link {color: blue;} /*未访问的链接*/ a:visited {color: purple;} /*已访问的链接*/ a:hover {color: red;} /*鼠标悬停在链接上*/ a:active {color: green;} /*链接被点击时*/ /*元素状态伪类选择器*/ input:checked {background-color: yellow;} /*被选中的input元素*/ input:disabled {background-color: gray;} /*被禁用的input元素*/ :focus {border: 1px solid red;} /*焦点在元素上*/ /*结构性伪类选择器*/ :first-child {background-color: gray;} /*父元素下的第一个子元素*/ :last-child {background-color: black;} /*父元素下的最后一个子元素*/ :nth-child(odd) {background-color: yellow;} /*父元素下的第奇数个子元素*/ :nth-child(even) {background-color: orange;} /*父元素下的第偶数个子元素*/ /*伪元素选择器*/ ::before {content: "before";} /*在元素之前插入内容*/ ::after {content: "after";} /*在元素之后插入内容*/
伪类选择器可以用于增强页面交互性,也可以用于修改元素的样式。在使用伪类选择器时,需要注意选择器的准确性和兼容性。