继承

一些属性可以被继承,一些不可以。

一般来说,字体颜色、字体大小会被继承,关于形状的如 padding 、border 、margin、width等就不会被继承。哪些属性属于默认继承很大程度上是由常识决定的。

控制继承

CSS提供了四个通用属性值来控制继承,每个CSS属性都可以接收这些值。

  • inherit 继承父元素的属性值
  • initial  设置属性值和浏览器默认样式相同
  • unset  将属性重置为自然值,如果有inherit的话就是inherit,否则和initial一样
  • revert  很少浏览器支持

重设所有属性值

all : unset initial inherit  revert

  撤销对所有样式所做的更改,以便回到之前已知的起点。


层叠

有时对于一些元素有多条规则,那么应该选用哪条规则应用于这些元素?

根据重要性从上到下,有三个因素需要考虑:

  • 资源顺序

    当两条同级别的规则应用到同一个元素上时,写在后面的规则就是实际使用的规则

  • 优先级

  声明在style属性(内联样式) > ID选择器 >类选择器、属性选择器、伪类选择器 > 元素选择器、伪元素选择器

  选择范围越小,优先级越高,因为越精确。

  因此通用的做法是,给基本元素定义通用的样式,根据需求再创建不同的类。

选择器属性优先级计算:

一个选择器的优先级由四个部分相加 ,可以认为是个十百千 —— 四位数的四个位数:

    1. 千位: 如果声明在 style 的属性(内联样式)则该位得一分。这样的声明没有选择器,所以它得分总是1000。
    2. 百位: 选择器中包含ID选择器则该位得一分。
    3. 十位: 选择器中包含类选择器、属性选择器或者伪类则该位得一分。
    4. 个位:选择器中包含元素、伪元素选择器则该位得一分。

注意:

1. 通用选择器(*)、组合符合(>, ~, +, ' ')和否定伪类(: not) 不会影响优先级。

2. 计算时不能进位,即20个元素选择器的叠加 也不能超过一个类选择器。

  • ! important

    ! important 优先级最高,能够覆盖普通规则的层叠。

    覆盖 ! important 的唯一办法是用另一个位置靠后或者具有更高优先级的 ! important 覆盖它。

    但是我们应该尽量避免使用这个属性,因为调试起来会不方便。

最新文章

  1. C#3.0扩展方法学习篇
  2. iphone如何导出微信聊天记录到电脑?
  3. lunece全文检索的入门与简单优化
  4. php日历
  5. C语言extern作用(全局变量)
  6. MySQL优化技巧之三(索引操作和查询优化)
  7. Python 全栈开发 -- 开发环境篇
  8. HTML5 文件域+FileReader 分段读取文件并上传(八)-WebSocket
  9. 修改oracle服务器所在linux主机名
  10. asp.net Form 认证【转】
  11. VC档(夹)文件夹路径的经营方针和代码
  12. on使用详解
  13. linux 更改用户的默认shell
  14. Javascript设计模式(2)-单体模式
  15. 使用DOS命令关闭tomcat端口(其他服务也是可以的)
  16. 我的Lambda的学习笔记
  17. maven安装与环境变量配置
  18. Ajax不执行回调函数的原因(转)
  19. Arch i3wm
  20. PowerShell 命令行调试指引(转)

热门文章

  1. JS缓冲运动案例
  2. 说一说packet poll 错误掩码的一个bug tcp udp packet poll细节有所不同 处理时需要注意
  3. linux netfilter nat1
  4. Proftp最简匿名访问配置
  5. ceph单机多mon的实现
  6. samba配置用户访问方法
  7. Docker版EKL安装记录文档
  8. Mysql_笔记2018.1.28
  9. 洛谷 P2101 命运石之门的选择 (分治)
  10. 查看php扩展