CSS中的样式一共有三种来源:创作人员、读者和用户代理,来源的不同会影响到样式的层叠方式,很多第一次学习CSS的朋友,对这三种来源可能会存在一些困惑,下面我写一下自己的理解,若有错误的地方还请指正。

首先,创作人员(author’s style)样式应该是我们最熟悉的,如果你是一个前端开发者,那么你写的那些样式就叫做创作人员样式。

然后是用户代理样式(agent’s style),用户代理也就是我们通常所说的浏览器(IE、Firefox等等),这些浏览器会提供一些默认的样式,比如IE浏览器中,一个纯粹由 html代码构成的网页里,我们会发现超链接会带有一个蓝色的前景色,这其实就用户代理样式,借用一些插件我们可以方便的查看这些默认样式(比如 Firefox中的Web developer

最后,也是最容易被我们忽略的,读者样式(reader’s style)。所谓读者自然就是浏览网页的用户,有些时候这些用户里可能会有人不满意网页的配色,或者字体大小,这时候他们就是通过浏览器提供的接口为网站添加读者样式。

介绍完了来源,我们来说一下如何按权重和来源排序,根据《CSS权威指南》(第三版P79)中总结的权重排序:

  1. 创作人员的样式 > 读者人员的样式 > 用户代理的默认样式

  2. 标记为重要声明(!important)的读者样式 > 一切样式

有的朋友可能一开始不太明白第二条的意思,实际上这是CSS提供的一个很好的选择机制,也就是说,通常情况下,创作人员样式会拥有最大的权重,这也是作为开发人员最想要看到的,但是用户拥有最终的选择权,可以通过!important覆盖到任何想要覆盖的样式。

原文地址:http://www.rays2010.com/blog/?p=2894

《转载》CSS中的三种样式来源:创作人员、读者和用户代理的更多相关文章

  1. SS中的三种样式来源:创作人员、读者和用户代理

    CSS中的样式一共有三种来源:创作人员.读者和用户代理,来源的不同会影响到样式的层叠方式,很多第一次学习CSS的朋友,对这三种来源可能会存在一些困惑,下面我写一下自己的理解,若有错误的地方还请指正. ...

  2. css中的三种基本定位机制

    css中的三种基本定位机制 a.普通文档流 b.定位:相对定位 绝对定位 固定定位 c.浮动 1.普通流中,元素位置由文档顺序和元素性质决定,块级元素从上到下依次排列,框之间的垂直距离由框的垂直mar ...

  3. CSS中的三种基本的定位机制(普通流、定位、浮动)

    一.普通流 普通流中元素框的位置由元素在XHTML中的位置决定.块级元素从上到下依次排列,框之间的垂直距离由框的垂直margin计算得到.行内元素在一行中水平布置. 普通流就是html文档中的元素如块 ...

  4. 转载:CSS的组成,三种样式(内联式,嵌入式,外部式),优先级

    (仅供自己备份) 原文地址:http://blog.csdn.net/chq11106004389/article/details/50515717 CSS的组成 选择符/选择器+声明(属性+值) 选 ...

  5. 理解CSS中的三种选择器>+~

    1. p~ul p和ul有相同的父元素,选择出p元素之后的所有ul元素,其中,p和ul不一定是紧随,但是必须有相同的父元素 E+F            相邻兄弟选择器.选择匹配F的元素,且该元素位于 ...

  6. CSS中的三种基本的定位机制

    CSS 定位机制 CSS 有三种基本的定位机制:普通流.浮动和绝对定位. 一.普通流 除非专门指定,否则所有框都在普通流中定位.普通流中元素框的位置由元素在(X)HTML中的位置决定.块级元素从上到下 ...

  7. 转载Jquery中的三种$()

    1.$()可以是$(expresion),即css选择器.Xpath或html元素,也就是通过上述表达式来匹配目标元素. 比如:$("a")构造的这个对象,是用CSS选择器构建了一 ...

  8. js oop中的三种继承方法

    JS OOP 中的三种继承方法: 很多读者关于js opp的继承比较模糊,本文总结了oop中的三种继承方法,以助于读者进行区分. <继承使用一个子类继承另一个父类,子类可以自动拥有父类的属性和方 ...

  9. CSS选 择器 三种样式

    一.CSS三种样式 代码 宽度 高度 实线 颜色  A内联样式是优先级最高的方式 px必须写 A:内联式  弊端:代码多很乱 <body> <div class="divc ...

随机推荐

  1. pay lip service to

    Understanding Progressive Enhancement中看到了这句话: Concerned with content availability, overall accessibi ...

  2. Python正则匹配多行,多个数据

    最近用Python做一个crawler工具的时候,发现用一个正则表达式可以匹配到个数据的时候用match.group()只能打印出第一个数据,其它数据不能打印出来.最后找到解决方法,现在记录一下,直接 ...

  3. bzoj1233

    首先这道题有一个很重要的贪心就是 在保证所有干草堆都能参与搭建的前提下,我们尽量使最底层的宽度小,这样搭起来的的干草堆高度一定是最高的 当我们以第i个干草堆为一层,显然最优的情况是找到一个尽可能小的j ...

  4. AjaxPro使用说明

    转自:http://www.cnblogs.com/lexus/archive/2007/11/29/977281.html 目录 AjaxPro使用说明    1 目录    2 修改历史纪录    ...

  5. PowerDesigner使用总结 转

    PowerDesigner使用总结 (友情提示:本博文章欢迎转载,但请注明出处:陈新汉,http://www.blogjava.net/hankchen)一.使用PowerDesigner生成HTML ...

  6. Delphi TcxTreeList 节点添加图片

    需要给TcxTreelist的列添加图片,操作如下 1.设置列, 设置Properties为ImageComboBox , 2. 设置Properties -> Items 添加内容 对应的增加 ...

  7. ARM学习笔记2——分支跳转指令

    一.Arm指令条件码和条件助记符 二.跳转指令B 1.作用 跳转指令B使程序跳转到指定的地址执行程序(跳转范围是PC-32MB到PC+32MB) 2.指令格式(注:B后面如果有条件,条件就是紧跟在B后 ...

  8. QEMU MIPIS远程共享ubuntu主机的文件

    尝试啦很多中办法,最终选择以在QEMU模拟器中ssh 远程登入的方式访问主机,并用sshfs 挂载 主机端的文件到模拟器中,实现模拟器访问主机端的代码. SSH分客户端openssh-client和o ...

  9. 【解决】U盘装系统(Win7/Win8)& 装双系统

    作为一名计算机的学生,不会装系统是不是会被笑掉大牙?!! .. 我一直就不太会(不是不会,是不熟练) .. 所以今天闲着没事,把旧电脑捣鼓起来 .. 主要是为了熟悉U盘装系统和装双系统的步骤 .. 基 ...

  10. General: Know How to Use InetAddress

    Modern applications often need the ability to learn information about hosts out on the network. One ...