CSS的继承与优先级
- CSS样式继承性
body,div,p{}

- html文档可以上图的种种节点树的形式表示,css层叠样式表中的各元素也有这种对应关系
- <body>是文档中最大的根节点,body中的所有元素都是body的后代元素
- 从各元素的关系上分析:各元素之间有如下几种关系:
E F 后代关系
E>F 父子关系
E,F (E,可以是任意的元素类型,可以跨级)
E+F 相邻关系
详细说明:
HTML文档是一种树状的结构。各元素之间有一定的层级关系。这种关系同样反映在CSS中。
CSS中,内层元素将继承外层元素的样式;
多个外层元素的样式,最终都要叠加到内层元素上。
如果内层元素单独又指定了与父元素同名的属性,将被替换。
<body>标记是最顶层元素,<body>中的所有样式,都会被它的后代元素继承。
可以继承的CSS属性有哪些?
文本样式、字体样式、列表样式具有继承性
font-family,font-size,font-weight,font-style,color,,font
text-indent,text-decoration,text-transform,line-height,text-align,
list-style-image,list-style-position,list-style-type,list-style
- CSS选择器的优先级
两两比较得出以下结论:
- 行类样式的优先级>class选择器
- id>class
- 行类样式的优先级>id
以上三个结论得出:
行内样式>id样式>class样式
- 4、!important> 行类样式的优先级
结论:!important>行内样式>id选择器样式>class选择器样式

CSS的继承与优先级的更多相关文章
- CSS三大特性(继承、优先级、层叠)之个人见解
首先声明一下CSS三大特性——继承.优先级和层叠.继承即子类元素继承父类的样式,比如font-size,font-weight等f开头的css样式以及text-align,text-indent等t开 ...
- css选择器---继承,优先级,层叠
CSS三大特性—— 继承. 优先级和层叠. 继承:即子类元素继承父类的样式; 优先级:是指不同类别样式的权重比较; 层叠:是说当数量相同时,通过层叠(后者覆盖前者)的样式. css选择符分类 首先来看 ...
- CSS系列:CSS的继承与层叠特性
1. CSS的继承特性 所有的CSS语句都是基于各个标记直接的继承关系,CSS继承是指子标记会继承父标记的所有样式风格,并可以再父标记样式风格的基础上再加以修改,产生新的样式,而子标记的样式完全不会影 ...
- CSS3学习笔记-1:CSS样式继承
自己在写css时总会遇上css样式继承的问题,好在一般问题不大,但一直也不明白css样式继承的规则,最近发现了一篇文章讲的不错,因此转载过来: 所谓CSS的继承是指被包在内部的标签将拥有外部标签的样式 ...
- CSS 从入门到放弃系列:CSS的选择器和优先级
CSS的选择器和优先级 CSS的N种选择器 !important 其实这个玩意不算什么选择器,放在这只是为了突出这个选择器优先级或者说权重的从高到低而已.. 内联方式(行间样式) <div st ...
- css样式继承规则详解
css样式继承规则详解 一.总结 一句话总结:继承而发生样式冲突时,最近祖先获胜(最近原则). 1.继承中哪些样式不会被继承? 多数边框类属性,比如象Padding(补白),Margin(边界),背景 ...
- css的继承之width属性(容易忽略)
众所周知,css的三大特性分别是 继承性,层叠性,和优先级. 那么这里就详细说一下css中width的继承性及其特殊情况. 继承性概念详解:css的继承性指的被包在内部的标签拥有外部标签的样式性,子元 ...
- CSS选择器与CSS的继承,层叠和特殊性
什么是选择器?选择器{样式;},在{}之前的部分就是"选择器","选择器"指明了{}中的"样式"的作用对象,也就是"样式" ...
- CSS学习之选择器优先级与属性继承
CSS学习之选择器优先级与属性继承 选择器优先级 其实选择器是具有优先级的,我们来看下面这一组案例: <!DOCTYPE html> <html lang="en" ...
随机推荐
- Codeforces Round #330 (Div. 2) B. Pasha and Phone 容斥定理
B. Pasha and Phone Time Limit: 20 Sec Memory Limit: 256 MB 题目连接 http://codeforces.com/contest/595/pr ...
- UOJ #142. 【UER #5】万圣节的南瓜灯 并查集
#142. [UER #5]万圣节的南瓜灯 Time Limit: 20 Sec Memory Limit: 256 MB 题目连接 http://uoj.ac/problem/142 Descrip ...
- codeforces Gym 100418D BOPC 打表找规律,求逆元
BOPCTime Limit: 20 Sec Memory Limit: 256 MB 题目连接 http://acm.hust.edu.cn/vjudge/contest/view.action?c ...
- CSS里的单位
CSS中预设了16种颜色以及16种颜色的衍生色,这16种颜色是CSS规范推荐的.并且一些主流的浏览器都可以识别.例如以下表所看到的: 十六进制颜色是最经常使用的定义方式.它的基本格式为#RRGGBB, ...
- [MEAN Stack] First API -- 4. Organize app structure
The app structure: Front-end: app.js /** * Created by Answer1215 on 12/9/2014. */ 'use strict'; func ...
- Unity3D脚本--经常使用代码集
1. 訪问其他物体 1) 使用Find()和FindWithTag()命令 Find和FindWithTag是很耗费时间的命令,要避免在Update()中和每一帧都被调用的函数中使用.在Start() ...
- JAVA static 作用
static表示“全局”或者“静态”的意思,用来修饰成员变量和成员方法,也可以形成静态static代码块,但是Java语言中没有全局变量的概念. 被static修饰的成员变量和成员方法独立于该类的任何 ...
- springmvc03 非注解和注解处理器映射器和适配器
1其它非注解处理器映射器和适配器 .1BeanNameUrlHandlerMapping(映射器) 根据请求url(XXXX.action)匹配spring容器bean的 name 找到对应的bean ...
- [ZZ]C++中,引用和指针的区别
(1) 引用总是指向一个对象,没有所谓的 null reference .所有当有可能指向一个对象也由可能不指向对象则必须使用 指针. 由于C++ 要求 reference 总是指向一个对象所以 re ...
- java_DAO类基本设计
package cn.itcast.oa.base; import java.util.List; public interface BaseDao<T> { void save(T en ...