日期:2014-05-17  浏览次数:20644 次

CSS03——样式继承与层叠

CSS03样式继承与层叠

原创作品,允许转载,转载时请务必以超链接形式标明文章原始出处、作者信息和本声明。否则将追究法律责任。http://blog.csdn.net/taotaoyouarebaby/article/details/8764521

继承:

指应用在一个标签上的CSS属性被传到嵌套标签上的过程。

body{

  font-family: Arial, Serif;

}

body的子标签就能够继承body的字体属性。

继承的优先级:

最近的祖先样式胜出。

直接应用的样式胜出。

//html结构

<body>

  <p>

    <strong></strong>  

  </p>

</body>

//css内容

body{font-family: Arial; color:#FF99BA;}

p{color: #616161; font-size:18px;}

strong{font-size: 24px; font-family:Times;}

p将只会继承bodyfont-family属性;strong只会继承pcolor属性。

层叠:

样式的属性就用规则。指定浏览器如何处理同一标签中应用的多个样式(样式冲突)。

属性冲突规则(同一标签的多个样式):优先级

1. 权重大的胜出。

2. 相同权重:后导入的样式>先导入的样式。

权重:www.w3.org/TR/CSS21/cascade.html#specificity

样式类别

权重

标签样式、伪元素(eg:first-line)

1

类样式、伪类(eg:link)

10

ID样式

100

派生样式

所涉及样式的权重总和。

内联样式(行内样式)

1000

属性后加!importantIE6不支持。

在该属性上忽略权重值。利用此处的属性值。

内联样式:

A