这次给大家带来css中属性值继承如何使用，使用css中属性值继承的注意事项有哪些，下面就是实战案例，一起来看一下。
继承：html元素可以从父元素那里继承一部分css属性，即使当前元素没有定义该属性。
1.css可以和不可以继承的属性
不可继承的：display、margin、border、padding、background、height、min-height、max-height、width、min-width、max-width、overflow、position、left、right、top、bottom、z-index、float、clear、table-layout、vertical-align、page-break-after、page-bread-before和unicode-bidi。
所有元素可继承：visibility和cursor。
内联元素可继承：letter-spacing、word-spacing、white-space、line-height、color、font、font-family、font-size、font-style、font-variant、font-weight、text-decoration、text-transform、direction。
终端块状元素可继承：text-indent和text-align。
列表元素可继承：list-style、list-style-type、list-style-position、list-style-image。
表格元素可继承：border-collapse。
2.值的继承
继承也是基于文档树的，文档树中元素的某些属性可以被其子元素继承，每一个CSS属性都定义了它能否被继承。要设定文档的某些缺省样式属性，可以在文档树的根上设定该属性，如果这个属性可以继承，则其后代元素将继承这个属性，例如color、font-size等属性。
3.“inherit（继承）”值
每一个属性可以指定值为“inherit”，即：对于给定的元素，该属性和它父元素相对属性的计算值取一样的值。继承值通常只用作后备值，它可以通过显式地指定“inherit”而得到加强，例如：
p { font-size: inherit; }
4.继承的局限性
继承虽然减少了重复定义的麻烦，但是，有些属性是不能继承的，例如border（边框）、margin（边距）、padding（补白）和背景等。
这样设定是有道理的，例如，为一个
设定了边框，如果此属性也继承的话，那么在这个
内所有的元素都会有边框，这无疑会产生一个让人眼花缭乱的结果。同样的，影响元素位置的属性，例如margin（边距）和padding（补白），也不会被继承。
同时，浏览器的缺省样式也在影响着继承的结果。例如：
body { font-size: 12px; }
2级标题的文字不是12px。
// H2中文字将是标题2样式的文字而非12px大小的文字。
这是因为浏览器的缺省样式设定了
的CSS规则。
同时，有些老版本的浏览器可能对继承支持的不太好，例如某些浏览器当遇到
的时候，就会丢失所有的继承的属性
5.能否取消
css属性一旦继承了不能被取消，只能重新定义样式。
6.案例
父元素position:relative 子元素：position:absolute 父元素宽度固定，子元素会继承父元素的宽度（对于二级导航很重要，当隐藏的那个导航栏宽度不固定，或者宽度大于父元素时，此时一般只能重新设置子元素的宽度）
走岔了，就退回来；走得急，就缓一些。时不时停下来想想，望一望，琢磨琢磨，再继续走。
相信看了本文案例你已经掌握了方法，更多精彩请关注创想鸟其它相关文章！
推荐阅读：
css3的Transition平滑过渡菜单栏实现
css如何做出0.5像素的线条
以上就是css中属性值继承如何使用的详细内容，更多请关注创想鸟其它相关文章！
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。
如发现本站有涉嫌抄袭侵权/违法违规的内容， 请发送邮件至 chuangxiangniao@163.com 举报，一经查实，本站将立刻删除。
发布者：程序猿，转转请注明出处：https://www.chuangxiangniao.com/p/1609439.html
微信扫一扫 
支付宝扫一扫 
