玩转Dreamweaver8.0:关于冲突的CSS规则

2016-02-19 21:18 4 1 收藏

生活已是百般艰难,为何不努力一点。下面图老师就给大家分享玩转Dreamweaver8.0:关于冲突的CSS规则,希望可以让热爱学习的朋友们体会到设计的小小的乐趣。

【 tulaoshi.com - Web开发 】

  将两个或更多 CSS 规则应用于同一文本时,这些规则可能会发生冲突并产生意外的结果。浏览器按以下方式应用 CSS 规则:

  如果将两种规则应用于同一文本,浏览器显示这两种规则的所有属性,除非特定的属性发生冲突。例如,一种规则可能指定文本颜色为蓝色,而另一种规则可能指定文本颜色为红色。

(本文来源于图老师网站,更多请访问https://www.tulaoshi.com/webkaifa/)

  如果应用于同一文本的两种规则的属性发生冲突,则浏览器显示最里面的规则(离文本本身最近的规则)的属性。因此,如果外部样式表和内联样式同时影响文本元素,则应用内联样式。

(本文来源于图老师网站,更多请访问https://www.tulaoshi.com/webkaifa/)

  如果有直接冲突,则自定义 CSS 规则(使用 class 属性应用的规则)中的属性将覆盖 HTML 标签样式中的属性。

  在下面的示例中,为 h1 定义的样式可以指定所有 h1 段落的字体、大小和颜色,但应用于该段落的自定义 CSS 规则 .Blue 将覆盖 h1 样式中的颜色设置。另一个自定义 CSS 规则 .Red 将覆盖 .Blue,因为它位于 .Blue 样式的内部。

h1span class="Blue"This paragraph is controlled by the .Blue custom style and h1
HTML tag style.span class="Red"Except this sentence is controlled by the .Red style./span
Now we're back to the .Blue style./span/h1

来源:https://www.tulaoshi.com/n/20160219/1625832.html

延伸阅读
标签: Web开发
使用缩写可以帮助减少你CSS文件的大小,更加容易阅读。css缩写的主要规则如下: 颜色 16进制的色彩值,如果每两位的值相同,可以缩写一半,例如: #000000可以缩写为#000;#336699可以缩写为#369; 盒尺寸 通常有下面四种书写方法: property:value1; 表示所有边都是一个值value1; property:value1 value2; 表示top和bottom的值是value1,right...
标签: Web开发
层叠样式表 (CSS) 是一系列格式设置规则,它们控制 Web 页面内容的外观。使用 CSS 设置页面格式时,内容与表现形式是相互分开的。页面内容(HTML 代码)位于自身的 HTML 文件中,而定义代码表现形式的 CSS 规则位于另一个文件(外部样式表)或 HTML 文档的另一部分(通常为 部分)中。使用 CSS 可以非常灵活并更好地控制页面的外观,从精确的布局...
标签: Web开发
1. 标签内的多个属性之间,只要空一隔,不需要 逗号    a href="brand_me.html" target="browser_page" 2. CSS :选择器内的属性的多个值,也不要用符号隔开,只要空一隔    background: #ccc url(pattern.fif) repeat-x; 3. JavaScript语句的写法,下面是一些例子:     ◇ window.open("some_url","...
标签: Web开发
为什么进行CSS代码优化呢? 好,有两个原因。它可以帮助你变得更小的CSS文件大小和更好的写的代码。这个方法的优化工作实际,让你决定你想要多少压缩。从超压(几乎读和编辑被人类)视觉愉悦。我喜欢这个标准设置,因为它会给你一个小的。 另一个凉爽的特征是,它能帮助你用速记编码。我绝不是一位专家在样式表。我并不拥有所有的...
标签: Web开发
At-rules分装不同的CSS规则,应用在特定场合。 Importing import@规则引用另外的样式。例如,如果你想添加另外样式到现在的样式,可以这样: @import url(addonstyles.css); 这很像使用link元素连接CSS到HTML,本质上说有一个内容样式像下面: style type="text/css" media="all"@import url(monkey.cs...

经验教程

417

收藏

5
微博分享 QQ分享 QQ空间 手机页面 收藏网站 回到头部