位置：武汉粤嵌教育IT技术培训机构 > 学校动态 > CSS层叠性和继承性的概念区别

CSS层叠性和继承性的概念区别

来源：武汉粤嵌教育IT技术培训机构时间：2022/3/9 14:57:19

　　web前端技术中，css样式是非常常见的一个内容，我们在学习web前端技术的时候css样式也是会学到的，本期小编给大家介绍的web前端培训教程就是CSS层叠性和继承性的概念区别，来看看下面的详细内容吧。
　　
　　web前端培训教程：CSS层叠性和继承性的概念区别
　　
　　CSS是层叠式样式表的简称，层叠性和继承性是其基本特征。对于网页设计师来说，应深刻理解和灵活运用这两个概念。
　　
　　1.层叠性
　　
　　层叠性是指多种CSS样式的叠加。例如，当使用内嵌式CSS样式表定义
　　
　　标记字号大小为12m，外链式定义
　　
　　标记颜色为红色，那么段落文本将显示为12p既这两种样式产生了叠加。
　　
　　2.继承性
　　
　　继承性是指书写CSS样式表时，子标记会继承父标记的某些样式，如文本颜色和字号。例如，定义主体标记body的文本颜色为黑色，那么页面中所有的文本都将显示为黑色，这是因为其他标记都嵌套在标记中，是标记的子标记。
　　
　　继承非常有用，可以不必在标记的每个后代上添加相同的样式。如果设置的属性是一个可继承的属性，只需将它应用于父标记即可，例如下面的代码：
　　
　　p, div, hl, h2, h3, h4, ul, ol, dl, li(color: black;}
　　
　　就可以写成：
　　
　　body( color:black;}
　　
　　第二种写法可以达到相同的控制效果，且代码更简洁(种写法中有一些陌生的标记，了解即可)。
　　
　　恰当地使用继承可以简化代码，降低CSS样式的复杂性。但是，如果在网页中所有的标记都大量继承样式，那么判断样式的来源就会很困难，所以对于字体、文本属性等网页中通用的样式可以选用继承。例如，字体、字号、颜色等可以在body标记中统一设置，然后通过继承影响文档中所有文本。
　　
　　需要注意的是，并不是所有的CSS属性都可以继承，例如，下面的属性就不具有继承性。
　　
　　边框属性，如border、border-top、border-right、border-bottom等。
　　
　　外边距属性，如margin、margin-top、margin-bottom、margin-left等。
　　
　　内边距属性，如padding、padding-top、padding-right、padding-bottom等。
　　
　　背景属性，如background、background-image、background-repeat等。
　　
　　定位属性，如position、top、right、bottom、left、z-index等。
　　
　　布局属性，如clear、float、clip、display、overflow等。
　　
　　元素宽高属性，如width、height。
　　
　　注意：当为body标记设置字号属性时，标题文本不会采用这个样式，可能会认为标题没有继承文本字号，这种认识是错误的。标题文本之所以不采用body标记设置的字号，是因为标题标记h1~h6有默认字号样式，这时默认字号覆盖了继承的字号。

领取试听课

每天限量名额，先到先得

尊重原创文章，转载请注明出处与链接：http://www.peixun360.com/5732/news/495886/违者必究！以上就是武汉粤嵌教育IT技术培训机构小编为您整理 CSS层叠性和继承性的概念区别的全部内容。