CSS继承性

CSS属性继承:外层元素的样式,会被内层元素进行继承。

  多个外层元素的样式,最终都会“叠加”到内层元素上。

什么样的CSS属性能被继承呢?

CSS文本属性都会被继承的:

color、 font-size、font-family、font-style、 font-weight

text-align、text-decoration、text-indent、letter-spacing、line-height

提示:<body>中的CSS属性,会被所有的子元素继承。

CSS优先级

(1)单个选择器的优先级

行内样式 > id选择器 >  class选择器 > 标签选择器

(2)多个选择器的优先级

多个选择器的优先级,一般情况下,指向越准确,优先级越高。

特殊情况下,我们需要假设一些值:

标签选择器      优先级为1

类选择器        优先级为10

Id选择器        优先级为100

行内样式        优先级为1000

              计算以下优先级:

.news h1{color:red;}     优先级:10 + 1 = 11

        .title{color:blue;}        优先级:10

div.news h1{color:red;}   优先级:1 + 10 + 1 = 12

        h1.title{color:blue;}      优先级:1 + 10 = 11

CSS 继承和优先级的更多相关文章

  1. CSS继承总结

    CSS的一个重要特征就是继承,它是依赖于祖先-后代的关系的.继承是一种机制,它允许样式不仅可以应用于某个特定的元素,还可以应用于它的后代. CSS可以继承的属性有: 1.文字相关:font-famil ...

  2. CSS的继承与优先级

    CSS样式继承性 body,div,p{} html文档可以上图的种种节点树的形式表示,css层叠样式表中的各元素也有这种对应关系 <body>是文档中最大的根节点,body中的所有元素都 ...

  3. CSS三大特性(继承、优先级、层叠)之个人见解

    首先声明一下CSS三大特性——继承.优先级和层叠.继承即子类元素继承父类的样式,比如font-size,font-weight等f开头的css样式以及text-align,text-indent等t开 ...

  4. CSS选择器、优先级与匹配原理(转)

    CSS选择器.优先级与匹配原理 导航 为了分析Bootstrap源码,所以的先把CSS选择器相关的东东给巩固好 废话就不多说了 CSS 2.1 selectors, Part 1 计算指定选择器的优先 ...

  5. css权重及优先级问题

    css权重及优先级问题 几个值的对比 初始值 指定值 计算值 应用值 CSS属性的 指定值 (specified value)会通过下面3种途径取得: 在当前文档的样式表中给这个属性赋的值,会被优先使 ...

  6. [程序猿入行必备]CSS样式之优先级

    专业玩家请移步:http://www.w3.org/TR/CSS2/cascade.html 使用CSS控制页面样式时,常常出现设定的样式被"覆盖",不能生效的情况. 浏览器是根据 ...

  7. CSS 选择器及其优先级

    CSS 的选择器有很多类型,我们将常用的这些列表如下: 一.CSS 选择器的类别 1. 基本选择器 基本选择器 解释 备注 * 通用选择器,匹配所有元素 CSS2 E 元素选择器,匹配类型为 E 的所 ...

  8. CSS样式的优先级

    1.相同权值情况下,CSS样式的优先级总结来说,就是--就近原则(离被设置元素越近优先级别越高): 内联样式表(标签内部)> 嵌入样式表(当前文件中)> 外部样式表(外部文件中). 2.权 ...

  9. css !important用法以及CSS样式使用优先级判断

    之前一直看到很多css中都有!important这个样式,一直不知道有什么作用的,今天在网上详细了解了一下,看了别人的博客,顺便转载收藏一下 css !important用法CSS样式使用优先级判断 ...

随机推荐

  1. Vue.js 复选框

    demo <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <titl ...

  2. layui中load具体用法

    遮盖窗体,demo: layer.load(,{ // content: "加载中...", shade: [0.4,'#000'], //0.1透明度的白色背景 time:* } ...

  3. 继承中的隐藏(hide)重写(Override)和多态(Polymorphism)

    继承中的隐藏:(不要使用隐藏,语法没有错误但是开发项目时会被视为错误) 在继承类中完全保留基类中的函数名 //基类,交通工具 class Vehicle { public void Run() { C ...

  4. kafka和flume进行整合的日志采集的confi文件编写

    配置flume.conf 为我们的source channel sink起名 a1.sources = r1 a1.channels = c1 a1.sinks = k1 指定我们的source收集到 ...

  5. NX二次开发-获取切换按钮的当前状态UF_MB_ask_toggle_state

    NX9+VS2012 1.打开D:\Program Files\Siemens\NX 9.0\UGII\menus\ug_main.men 找到装配和PMI,在中间加上一段 TOGGLE_BUTTON ...

  6. NSDateFormatter 今年日期格式化成字符串是明年日期问题?

    在项目里我要是把NSDate格式化成字符串 我的format是@"YYYY年MM月dd日 HH:mm" 传入日期2013-12-30 15:00:00后,返回给我的字符串是 201 ...

  7. hdu4126_hdu4756_求最小生成树的最佳替换边_Kruskal and Prim

    目录 Catalog Solution: (有任何问题欢迎留言或私聊 && 欢迎交流讨论哦 Catalog Problem:  Portal: hdu4126 hdu4756  原题目 ...

  8. Java-Class-@I:org.springframework.stereotype.Service

    ylbtech-Java-Class-@I:org.springframework.stereotype.Service 1.返回顶部   2.返回顶部 1. package com.ylbtech. ...

  9. 配置Dubbo Demo遇到的坑之一---找不到dubbo.xsd文件

    原文地址:https://blog.csdn.net/qq_36654870/article/details/80603302 1.dubbo.xsd文件不能读取 因为阿里http://code.al ...

  10. python list基本操作一

    a = [1,2,3,1,2,3] 一.删除元素 1.按索引删除: a.pop(1) # 删除第二个值 # in:[1,2,3,2] # out:[1,3,2] 返回值:被删除的元素,这个时候list ...