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

css3子选择器

2015-08-09 21:53 465 查看

<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
<style type="text/css">
.parent {
border: 1px solid red;
height: 60px;
margin: 5px;
}
.son {
border: 1px solid red;
height: 20px;
}
.descendant {
border: 1px solid red;
height: 10px;
background-color: green;
}
/*
元素选择器:其中E是元素，也是选择器(E表示element元素的意思)
E {...}
=============================================================
class选择器:其中E是元素选择器，E.class是元素选择器和类选择器的复合选择器
E.class {...}
比如：div.son
=============================================================
属性选择器：E表示元素选择器
E[attr=value]或E[attr]
比如：div[id=abc]
=============================================================
子选择器：其中selector1、selector2都是有效的选择器
selector1>selector2 {...}
*/
.parent>div.son {
background-color: yellow;
}
</style>
</head>
<body>
<div class="parent">
<div class="son">
<div class="descendant"></div>
</div>
<div class="son"></div>
</div>
</body>
</html>

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

标签：

相关文章推荐

新的分享

章节导航