学习条件
- 了解css/css3常见选择器
学习目标
- 了解选择器权重的计算
- 了解浏览器默认样式
- 了解样式的继承
- 了解样式的层叠
样式的层叠即样式权重、浏览器默认样式、以及样式继承三方影响的最后计算结果
学习资源
习题
- 习题一:根据如下代码计算div、ul、和li的最终样式
//html代码
<div class="list list-member">
<ul>
<li>member ID1</li>
<li>member ID2</li>
<li>member ID3</li>
</ul>
</div>
//css代码
.list li {
margin: 10px 0 0 0;
font-size: 14px;
color: #666;
}
.list-member li {
font-size: 12px;
}
提示:需要考虑浏览器默认样式,样式权重,以及样式继承。先思考,给出一个答案,在写一个简单的网页,将代码复制上去到浏览器验证
下面可以学
- 页面布局