室内设计培训
平面设计培训
部落窝教育
网站首页 >> 设计在线 >> 文章内容

CSS继承

[日期:2010-03-07]   来源:主流技术阁  作者:主流技术阁   阅读:3719[字体: ]

  所谓CSS层叠样式表的继承是指被包含在内部的标签将拥有外部标签的样式性质。继承特性最典型的应用通常发挥在整个网页的样式预设,需要指定为其它样式的部份设定在个别元素里即可。这项特性可以给网页设计者提供更理想的发挥空间,但同时继承也有很多规则,下面我们谈一下这方面的应用。

  一、继承

  CSS的一个主要特征就是继承,它是依赖于祖先-后代的关系的。继承是一种机制,它允许样式不仅可以应用于某个特定的元素,还可以应用于它的后代。例如一个BODY定义了的颜色值也会应用到段落的文本中。

  在嵌套声明中存在css的继承问题。就是父标签中定义css,在子标签中定义css遵循子没有的样式,就继承父的样式,子标签有的,将覆盖父标签的样式。

  二、CSS继承的局限性

  在CSS中,继承是一种非常自然的行为,我们甚至不需要考虑是否能够这样去做,但是继承也有其局限性。
  首先,有些属性是不能继承的。这没有任何原因,只是因为它就是这么设置的。举个例子来说:border属性,大家都知道,border属性是用来设置元素的边框的,它就没有继承性。多数边框类属性,比如象Padding(补白),Margin(边界),背景和边框的属性都是不能继承的。

  三、人为定义CSS继承优先级

  在制作网页的过程中,我们可能想要设置某个规则比其他的规则更重要,CSS中允许这样设置,它们被称为重要规则(important rule)。这是根据其声明的方式和它们的自然属性来命名的。通过在一条规则的分号前插入!important这样一个短语来标记一条重要规则。
  如:P.apple {color:#red !important; background:white;}
  颜色值#red被标记为!important,而背景色white未被标记,如果需要二条规则都是重要的话,那么每条规则都需要标上!important。
  正确地放置!important的位置是很重要的,否则整条规则将为无效。!important总是放在规则声明的最后,在分号之前。
  标记为!important的规则具有最高的权值,也就是说他没有具体的特性值,但是比其他的权值都要大。需要注意的是,虽然制作者定义的样式比用户定义的样式具有更高权值时,但!important规则恰恰相反:重要的用户定义规则要比制作者定义的样式具有更高权值,即使是标记为!important的重要规则也是如此。
  下面举例说明:
  样式定义:
  H1 {color:gray !important;}
  应用举例代码:
  <H1 STYLE=”color:black;”>看这儿!</H1>
  !important规则会覆盖内联STYLE属性的内容,所以结果文字是灰色的而不是黑色的。

主流技术阁PS,CDR,213班 分享到: QQ空间 新浪微博 腾讯微博 人人网
photoshop教程
Photoshop教程
平面设计教程
Photoshop教程