转自知乎上的回答：http://www.zhihu.com/question/20077745

解答一：

层叠指的是样式的优先级，当产生冲突时以优先级高的为准。
1. 开发者样式>读者样式>浏览器样式（除非使用!important标记 ）
2. id选择符>（伪）类选择符>元素选择符
3. 权重相同时取后面定义的样式

以下是一段经典的html，三个类名分别为模块、标题和正文。
<div class="mod">
<div class="hd"></div>
<div class="bd"></div>
</div>
大部分html页面都可以由这种结构嵌套或者累加而成。

解答二：

CSS层叠是指CSS样式在针对同一元素配置同一属性时，依据层叠规则（权重）来处理冲突，选择应用权重高的CSS选择器所指定的属性，一般也被描述为权重高的覆盖权重低的，因此也称作层叠。每个CSS选择器都会有一个权重（行内1000，id100，class10，tag1、可以这样认为），当两个选择器同时配置同一元素的同一属性时（比如一个设置color：red，另一个color：black），就会产生冲突，而解决冲突的方案就是CSS选择器的权重，权重高的来覆盖权重低的。
另外，继承的属性是权重重最轻的，会被上面的四个定义方式覆盖。

CSS语义化其实更多地是指HTML的语义化。 比如下面的一个代码我们这样写：
<div class="box">
<div class="h2">这是区块标题</div>
<div class="bd">这是区块内容</div>
<div> 
但是语义化的写法更能使得 robot识别网页的结构，下面是语义化的写法：
<section>
<h2>这是区块标题</h2>
<p>这是区块内容</p>
</section>
对于robot来说，它能够识别section（区块）、h2(二级标题)、p(文字段落)，但是不能识别出div所包含的内容，因为div这个标记本身是无语义的（必要时通过class或id属性来赋予语义，但是这是次优选择）。 而HTML5新增的article、header、footer、nav、section等标签就是丰富了HTML原生的语义标签，在很大程度上满足了HTML编写的需要。

解答三：

我的理解是，层叠指的是—上级标签的样式会自动继承到其所有下级标签，如针对<body>设置的标签选择器所设的字体样式会自动应用到<body>下的<p>中，除非<p>重写了相关样式将其覆盖。
CSS语义化的命名是指用易于理解的名称对html标签附加的class或id命名，如对于页面上方的<div>，可将其id设为header；页面下方的<div>设为footer，可以增强CSS的可维护性。

基本上层叠的意思就是“继承”、“权重”、“覆盖”，通过良好的层级命名更好的实现效果，更少的代码，更多的功能

CSS层叠样式表的层叠是什么意思（转自知乎）的更多相关文章

  1. CSS层叠样式表的层叠是什么意思

    层叠的意思就是“继承”.“权重”.“覆盖”,通过良好的层级命名更好的实现效果,更少的代码,更多的功能,下面为大家详细介绍下,感兴趣的朋友不要错过   解答一: 层叠指的是样式的优先级,当产生冲突时以优 ...

  2. 深入理解CSS中的层叠上下文和层叠顺序(转)

    by zhangxinxu from http://www.zhangxinxu.com 本文地址:http://www.zhangxinxu.com/wordpress/?p=5115 零.世间的道 ...

  3. css优先级和层叠

    css优先级和层叠 1.优先级    计算方法:        a.行内样式        b.id选择器的数量        c.类,伪类和属性选择器的数量        d.标签选择器和伪元素选择 ...

  4. 深入理解CSS中的层叠上下文和层叠顺序

    零.世间的道理都是想通的 在这个世界上,凡事都有个先后顺序,凡物都有个论资排辈.比方说食堂排队打饭,对吧,讲求先到先得,总不可能一拥而上.再比如说话语权,老婆的话永远是对的,领导的话永远是对的. 在C ...

  5. CSS层叠样式表(Cascading Style sheets)

    CSS层叠样式表(Cascading Style sheets) --------- ---------------- ----------- --------------- ----------- ...

  6. [转]深入理解CSS中的层叠上下文和层叠顺序

    http://www.zhangxinxu.com/wordpress/2016/01/understand-css-stacking-context-order-z-index/ 零.世间的道理都是 ...

  7. 《精通CSS层叠样式表》

    书名 <精通CSS层叠样式表> 图片 时间 2017-7月 学习 感觉和ps一样对我都不友好 3天撸完

  8. CSS：CSS层叠样式表的概述

    CSS层叠样式表:Cascading Style Sheets 介绍: 现代网页的设计原则是内容和样式分离,降低它们之间的直接相互依存关系,解耦性,同时,同样的内容,可以通过不同的CSS样式表现出来. ...

  9. css:层叠样式表-网页布局基础

    css:层叠样式表:一.写法分类: 1.内联(行内,写在标签里面,以属性的形式表现,属性名是style) 例:<table style="background-color: aqua& ...

随机推荐

  1. mysql mha 主从自动切换 高可用

    mha(Master High Availability)目前在MySQL多服务器(超过二台),高可用方面是一个相对成熟的解决方案. 一,什么是mha,有什么特性 1. 主服务器的自动监控和故障转移 ...

  2. mysql innobackupex xtrabackup 大数据量 备份 还原

    大数据量备份与还原,始终是个难点.当MYSQL超10G,用mysqldump来导出就比较慢了.在这里推荐xtrabackup,这个工具比mysqldump要快很多. 一.Xtrabackup介绍 1, ...

  3. 安装完win8后，显卡一些其他的驱动没有被正常安装，此处出现问题的机器是索尼vpccw18fc

    问题描述:安装完win8后机器无法正常开启,通过索尼欢迎页面按f10,修复进入,进入后一切正常,分辨率怪异,通过鲁大师检测显卡驱动以及一些细微的驱动没安装,但是鲁大师提示不支持这款显卡驱动,官网也没找 ...

  4. [Leetcode][JAVA] Palindrome Partitioning II

    Given a string s, partition s such that every substring of the partition is a palindrome. Return the ...

  5. OpenGL（三）——函数大全

    概述 根据自己写的小程序对各个函数进行解释 OpenGL函数 1. 颜色 1.1  glShadeModel 绘制指定两点间其他点颜色的过渡模式 没试 1.2  glColor 设置当前颜色:可以派生 ...

  6. log4j使用方法

    项目在开发运行阶段,需要根据日志调试或者排错,这时候就需要有日志管理来帮助我们解决这些问题: 在java中我们可以使用System.out.println(),但是这种方式功能呢个太弱,而且不易控制, ...

  7. 用c#开发微信（2）扫描二维码，用户授权后获取用户基本信息 （源码下载）

    本文将介绍基于Senparc.Weixin微信开发框架来实现网页授权来获取用户基本信息.先生成包含授权及回调url信息的二维码:用户用微信扫描之后,被要求授权以获取Ta的用户基本信息:用户授权后,通过 ...

  8. JBoss无规律自动关闭故障定位

    转载地址:http://blog.knowsky.com/264489.htm 最近遇到了几次JBoss无规律自动关闭的奇怪现象,通过history历史命令和last登录信息,都看不到有人操作过的迹象 ...

  9. xampp连接Admin界面报错

    报错信息: phpMyAdmin tried to connect to the MySQL server, and the server rejected the connection. You s ...

  10. javascript中对象函数继承的概念

    什么是函数对象?这个对象既是通常意义上的对象,又可以加上括号直接执行的函数. 产生函数对象的方式有两种:1.通过function关键字产生:var fn = function(){};2.实例化Fun ...