<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Bootstrap强调内容</title>
<link rel="stylesheet" href="bootstrap-3.3.5-dist/css/bootstrap.min.css"></head>
<body>
<div class="container">
<div class="jumbotron">
<p class="lead">这部分内容需要特别的强调，我和别人长得不一样</p>
<p>这部分内容需要特别的强调，我和别人长得不一样</p>
<!--在bootstrap-3.3.5好像lead没用了-->
</div>
</div>
</body>
</html>
2015-07-16
.jumbotron p{ margin-bottom:15px;font-size:21px;font-weight:200}/* 权值 = 10+1=11 */
.lead{ margin-bottom:20px;font-size:16px;font-weight:200;line-height:1.4}/* 权值 = 10 */
@media (min-width:768px){.lead{font-size:21px}
选择器的优先权
解释：
1. 内联样式表的权值最高 1000；
2. ID 选择器的权值为 100
3. Class 类选择器的权值为 10
4. HTML 标签选择器的权值为 1
CSS 优先级法则：
A 选择器都有一个权值，权值越大越优先；
B 当权值相等时，后出现的样式表设置要优于先出现的样式表设置；
C 创作者的规则高于浏览者：即网页编写者设置的CSS 样式的优先权高于浏览器所设置的样式；
D 继承的CSS 样式不如后来指定的CSS 样式；
E 在同一组属性设置中标有“!important”规则的优先级最大；
所以lead不起作用了（.jumbotron p权值 = 11 > .lead 权值 = 10 )
举报
