您的位置：首页 > Web前端 > CSS

css3状态选择性伪类

2015-08-09 21:58 519 查看

<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
<style type="text/css">
/*selector:enabled:匹配selector，并且当前处于可用状态的元素*/
input[type=text]:enabled {
outline: 1px solid red;
}
/*选择只读的表单元素*/
input[type=text]:-moz-read-only {
outline: 1px solid green;
}
input[type=text]:read-only {
outline: 1px solid green;
}
/*选择不可使用的表单元素*/
input:disabled {
outline: 1px solid chocolate;
}
/*选择被选中的表单元素*/
input:checked {
outline: 1px solid black;
}
/*
被用户选中或处于高亮的元素
可以改color、backgroundcolor、cursor、outline
*/
p::selection {
color: blueviolet;
}
</style>
</head>
<body>
<input type="text" value="不可用的" disabled="disabled" /><br/>
<input type="text" value="可用的" /><br/>
<input type="text" value="只读" readonly /><br/>
<input type="radio" checked="checked" /><input type="checkbox" checked />
<p>我叫左王超，我是一个秘书！</p>
</body>
</html>

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航