为您解读CSS优先级 - 网页制作

　为您解读CSS优先级

作者：dh20156　时间： 2009-06-18　文档类型：转载　来自：W3C标准WEB前端DHTML精英俱乐部

第 1 页为您解读CSS优先级 [1]
第 2 页为您解读CSS优先级 [2]
第 3 页为您解读CSS优先级 [3]
第 4 页为您解读CSS优先级 [4]

2. 如何让<h3>始终为黑色，而<em>在不被<h3>包含的情况为红色：

运行代码框
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <meta http-equiv="Content-Language" content="gb2312" /> <title>test</title> <meta name="Author" content="doyoe(飘零雾雨), edzmaster@gmail.com" /> <style type="text/css"> h3,h3 em { color:#000; } em { color:#f00; } </style> </head> <body> <h3>讨论<em>CSS</em>优先级</h3> <p>讨论<em>CSS</em>优先级</p> </body> </html>
[Ctrl+A 全部选择提示：你可先修改部分代码，再按运行]

固定效果：

固定代码：

3. 如何写一个外部样式使得
<h3 style="color:#000;"> 覆盖我</h3>
的颜色为红色：

运行代码框
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <meta http-equiv="Content-Language" content="gb2312" /> <title>test</title> <meta name="Author" content="doyoe(飘零雾雨), edzmaster@gmail.com" /> <style type="text/css"> h3 { color:#f00!important; } </style> </head> <body> <h3 style="color:#000;">覆盖我</h3> </body> </html>
[Ctrl+A 全部选择提示：你可先修改部分代码，再按运行]

4. 如何让同时具有.a,.b样式的元素只表现.a的颜色样式：

运行代码框
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <meta http-equiv="Content-Language" content="gb2312" /> <title>test</title> <meta name="Author" content="doyoe(飘零雾雨), edzmaster@gmail.com" /> <style type="text/css"> .b { color:#000; } .a { color:#f00; } </style> </head> <body> <p class="a b">传说中滴测试</p> </body> </html>
[Ctrl+A 全部选择提示：你可先修改部分代码，再按运行]

固定代码：

<p class="a b">传说中滴测试</p>

关于样式优先级，今天就先聊到这。

原文：http://www.v-ec.com/dh20156/article.asp?id=241

本文链接：http://www.blueidea.com/tech/web/2009/6801.asp　

出处：W3C标准WEB前端DHTML精英俱乐部
责任编辑：bluehearts

上一页为您解读CSS优先级 [3] 下一页

◎进入论坛网页制作、WEB标准化版块参加讨论，我还想发表评论。

相关文章

CSS Sprites 图片整合技术

作者文章

XHTML1.0与HTML兼容指引16条

JavaScript优化细节

站点最新

站点最新列表

HTC Sense 体验与体验背后的故事

我希望能再"大气"一些

通过shtml实现重构页面模块化构建

如何设计新手用户引导

27个超漂亮的信息图表

商业产品色彩体系

Treehouse融资60万美元

Solve Media用广告代替验证码

互联网产品"冷启动"问题浅析

用户体验的价值

栏目最新

栏目最新列表

浅谈JavaScript编程语言的编码规范

如何在illustrator中绘制台历

Ps简单绘制一个可爱的铅笔图标

数据同步算法研究

用ps作简单的作品展示页面

CSS定位机制之一:普通流

25个最佳最闪亮的Eclipse开发项目

Illustrator中制作针线缝制文字效果

Photoshop制作印刷凹凸字体

VS2010中创建自定义SQL Rule