十五、知识点补充
程序员文章站
2022-05-10 11:52:41
...
一、群组选择器
二、选择器继承 包含
三、p标签不能嵌套
上课代码
<!DOCTYPE html>
<html>
<head>
<title>组合选择器介绍</title>
<meta charset="utf-8">
<style type="text/css">
/*包含选择器写法 后代选择器*/
/*div ul li a{
text-decoration: none;
}*/
.mydiv1 a{ /*指div 里面的所有a标签*/
text-decoration: none;
}
h1,h2,h3,h4,h5,h6,ul,p{ /*群组选择器*/
margin: 0px;
padding: 0px;
}
.myclass>a{ /*子元素选择器 直接指定 myclass下面直接的a标签*，不是里面包含了就是*/
text-decoration: none;
font-size: 20px;
color: red;
}
/*选择相邻兄弟 只有h1 跟p之间才会有 此效果*/
h1 + p {margin-top:100px;}
</style>
</head>
<body>
<div class="mydiv1">
<ul>
<li><a href="#">首页</a></li>
<li><a href="#">产品介绍</a></li>
<li><a href="#">关于我们</a></li>
<li><a href="#">联系客服</a></li>
</ul>
<a href="#">我是外面的a</a>
</div>
<div>
<h1>我是h1</h1>
<h2>我是h1</h2>
<h3>我是h1</h3>
<h4>我是h1</h4>
<h5>我是h1</h5>
<h6>我是h1</h6>
<ul>
<li>aaaa</li>
<li>bbb</li>
<li>ccc</li>
</ul>
<p>我是p我是p1我是2</p>
</div>
<p>我是p1</p>
<p>我是p2<p>我是p3</p></p>
<div class="myclass">
<a href="#">我是>外面的</a>
<div><a href="#">我是>div里面的a</a></div>
</div>
<h1>This is a heading.</h1>
<p>This is paragraph.</p>
<p>This is paragraph.</p>
<p>This is paragraph.</p>
<h1>我是h1111</h1>
<p>This is paragraph.</p>
<p>This is paragraph.</p>
</body>
</html>
上一篇： 刷题知识补充
下一篇： 计算逆序对个数（归并排序）