| css伪类 | 您所在的位置：网站首页 › css定义标签 › css伪类 |
|
css伪类
css2的四个伪类:link 未访问的链接:visited 已访问的链接:hover 鼠标悬停链接:active 点击中的链接
css3新增伪类:empty 选择空标签:focus 选择当前获得焦点的表单元素:enabled 选择当前有效的表单元素:disabled 选择当前无效的表单元素:checked 选择当前已经勾选的单选按钮或者复选框:root 选择根元素，即标签
css2的四个伪类
:link 未访问的链接
:visited 已访问的链接
:hover 鼠标悬停链接
:active 点击中的链接
/* 未访问的链接 */
a:link {
color: #FF0000;
}
/* 已访问的链接 */
a:visited {
color: #00FF00;
}
/* 鼠标悬停链接 */
a:hover {
color: #FF00FF;
}
/* 已选择的链接 */
a:active {
color: #0000FF;
}
我是超链接
注意: 这四个伪类必须按照 :link，:visited，:hover ，:active的顺序书写才会生效。这里介绍一个记忆小技巧："爱恨法则"即 “love hate”。 css3新增伪类 :empty 选择空标签 div:empty{ width: 200px; height: 200px; background: #f00; } 文字1 文字2 :focus 选择当前获得焦点的表单元素下面的代码中哪个表单元素获得焦点就会被选中 input:focus{ width: 100px; height: 100px; background: #f00; } :enabled 选择当前有效的表单元素下面的代码中第二个input有disabled属性，所以只有第一个表单元素会被选中 input:enabled{ width: 100px; height: 100px; background: #f00; } :disabled 选择当前无效的表单元素 input:disabled{ width: 100px; height: 100px; background: #f00; } :checked 选择当前已经勾选的单选按钮或者复选框 input:checked{ width: 100px; height: 100px; background: #f00; } :root 选择根元素，即标签 |
| CopyRight 2018-2019 实验室设备网 版权所有 |