搜狐首页 - 新闻 - 体育 - 娱乐 - 财经 - IT - 汽车 - 房产 - 女人 - 短信 - 彩信 - 校友录 - 邮件 - 搜索 - BBS - 搜狗 
搜狐首页 >> IT频道_搜狐网站 >> 数码天下_搜狐IT >> 网狐教程-搜狐IT >> 网站制作-网狐教程-搜狐IT >> HTML
深入了解CSS(层叠样式表)的继承性及其应用
IT.SOHU.COM  2004-07-13 17:51  作者: donger  转自: 天极网
页面功能 【我来说两句】【我要“揪”错】【推荐】【字体: 】【打印】 【关闭

  三、继承中容易引起的错误

  有时候继承也会带来些错误,比如说下面这条CSS定义:

  Body{color:blue}

  在有些浏览器中这句定义会使除表格之外的文本变成蓝色。从技术上来说,这是不正确的,但是它确实存在。所以我们经常需要借助于某些技巧,比如将CSS定义成这样:

  Body,table,th,td{color:blue}

  这样表格内的文字也会变成蓝色。

  四、多种样式混合应用

  既然有了继承性,那么在样式表中的应用上可能会有些读者搞不清,多个样式表同时应用到一个对象上会发生什么情形呢?先举个简单的例子:

  样式定义:.apple{color:red;}  H1{color:yellow;}

  应用举例代码:<H1 CLASS=”apple”>这儿的苹果好红啊</H1>

  应用举例效果:因为选择符H1和.apple都匹配上面的H1元素,那么到底浏览器会应用哪一个呢?通过在浏览器中观察,我们发现这段文字应用了.apple这个样式,所以它显示的是红色。这是因为两条规则的特殊性不一样,CSS规则必须这样进行处理。

  

  样式表中的特殊性描述了不同规则的相对权重,它的基本规则是:

  统计选择符中的ID属性个数。
  统计选择符中的CLASS属性个数。
  统计选择符中的HTML标记名格式。

  最后,按正确的顺序写出三个数字,不要加空格或逗号,得到一个三位数。( 注意,你需要将数字转换成一个以三个数字结尾的更大的数)。相应于选择符的最终数字列表可以很容易确定较高数字特性凌驾于较低数字的。

  以下是一个按特性分类的选择符的列表:

  H1 {color:blue;}                        特性值为:1
  P EM {color:purple;}                    特性值为:2
  .apple {red;}                           特性值为:10 
  P.bright {color:yellow;}                  特性值为:11
  P.bright EM.dark {color:brown;}           特性值为:22
  #id316 {color:yellow}                   特性值为:100

  从上表我们可以看出#id316具有更高的特殊性,因而它有更高的权重。当有多个规则都能应用于同一个元素时,权重越高的样式将被优先采用。

上一页 [1] [2] [3] [4下一页 
页面功能 【我来说两句】【我要“揪”错】【推荐】【字体: 】【打印】 【关闭




ChinaRen - 搜狐招聘 - 网站登录 - 帮助中心 - 设置首页 - 广告服务 - 联系方式 - 保护隐私权 - About SOHU - 公司介绍
Copyright © 2005 Sohu.com Inc. All rights reserved. 搜狐公司 版权所有

相关链接
  • 与时俱进 下一代EFI CSS BIOS你了解吗(06/21 11:29)
  • 与时俱进 下一代EFI CSS BIOS你了解吗(06/21 11:28)
  • 在DW MX 2004中用CSS轻松实现色块标题标识(01/08 14:38)

  •  ■ 我来说两句
    用  户:        匿名发出:
    请各位遵纪守法并注意语言文明。
     
    *经营许可证编号:京ICP00000008号
    *《互联网电子公告服务管理规定》
    *《全国人大常委会关于维护互联网安全的规定》
    短信内容:
    手 机
    自写包月5分钱/条 更多>>
    搜狐天气为你抢先报! 魔力占卜姻缘一线牵!
    金币不是赚的是抢的! 爱情玄机任由你游戏!
    猪八戒这样泡到紫霞! 帅哥一定要看的宝典!
    你受哪颗星星的庇护? 萨达姆最新关押照片!
    精彩彩信
    [和弦]欧若拉 一生有你
    沧海一声笑
    [音效]挪威的森林
    爆铃 MP3 G点图 动画
    [和弦]童话 你到底爱谁
    [原唱]一千年以后 断点
    [爆笑音效]赚钱拉 野花
    [串烧]张韶涵 潘玮柏
    精彩短信
    [和弦]小薇 好心分手
    [音效]当当当当 忘记


    搜狐商城
    ·家电|品牌风扇新品热销
    ·音乐|秦海璐幸福回味
    ·图书|《眼镜蛇事件》
    更多...