简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW) 日本語(JA) 한국어(KO) Melayu(MS) Français(FR) Deutsch(DE)
首页 > web前端 > css教程 > 正文

css属性继承有哪些？css中可继承的属性和不可继承属性的总结

不言
发布： 2018-07-27 16:30:04
原创
15746 人浏览过

所谓继承就是指html元素可以从父元素那里继承一部分css属性，即使当前元素没有定义该属性。那么，css哪些属性能继承，哪些属性不能继承呢？下面我们就来看看css中属性继承的内容。

首先我们来看一下css优先级：

!important > 行内样式 > ID选择器 > 类选择器 > 标签 > 通配符 > 继承 > 浏览器默认属性。

常用的css不可继承的属性

display：规定元素应该生成的框的类型

text-decoration：规定添加到文本的装饰

text-shadow：文本阴影效果

white-space：空白符的处理

盒子模型的属性：width、height、margin 、border、padding

背景属性：background

定位属性：float、clear、position、top、right、bottom、left、min-width、min-height、max-width、max-height、overflow、clip、z-index

常用的css可继承的属性：

font：组合字体

font-family：规定元素的字体系列

font-weight：设置字体的粗细

font-size：设置字体的尺寸

font-style：定义字体的风格

text-indent：文本缩进

text-align：文本水平对齐

line-height：行高

color：文本颜色

visibility：元素可见性

光标属性：cursor

所有元素可以继承的

1、元素可见性：visibility

2、光标属性：cursor

内联元素可以继承的属性

1、字体系列属性

2、除text-indent、text-align之外的文本系列属性

块级元素可以继承的属性

text-indent、text-align

inherit（继承）值

每一个属性可以指定值为“inherit”，即：对于给定的元素，该属性和它父元素相对属性的计算值取一样的值。继承值通常只用作后备值，它可以通过显式地指定“inherit”而得到加强，例如：

p { font-size: inherit; }

继承的局限性

继承虽然减少了重复定义的麻烦，但是，有些属性是不能继承的，例如border（边框）、margin（边距）、padding（补白）和背景等。

这样设定是有道理的，例如，为一个

设定了边框，如果此属性也继承的话，那么在这个

内所有的元素都会有边框，这无疑会产生一个让人眼花缭乱的结果。同样的，影响元素位置的属性，例如margin（边距）和padding（补白），也不会被继承。

　　同时，浏览器的缺省样式也在影响着继承的结果。例如：

body { font-size: 12px; }
登录后复制

2级标题的文字不是12px。//

H2中文字将是标题2样式的文字而非12px大小的文字。

　　这是因为浏览器的缺省样式设定了

的CSS规则。

同时，有些老版本的浏览器可能对继承支持的不太好，例如某些浏览器当遇到

的时候，就会丢失所有的继承的属性。

 css属性一旦继承了不能被取消，只能重新定义样式。

 相关文章推荐：

CSS继承元素属性_html/css_WEB-ITnose

css中属性值继承如何使用

 css中属性值继承介绍

以上是css属性继承有哪些？css中可继承的属性和不可继承属性的总结的详细内容。更多信息请关注PHP中文网其他相关文章！

相关标签：
css属性继承
来源：php.cn
上一篇：什么是css选择器？css基本选择器的总结（九种） 下一篇：css的特性有哪些？css三个特性的分析（继承、优先级和层叠）
本站声明
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系admin@php.cn
作者最新文章
最新问题
CSS 样式未应用于网站 我正在使用Bootstrap5制作网站，但index.css属性未应用于index.html。当我将鼠标悬停在服务卡上时，背景应该会发生变化，从而产生过渡效果。应该是从这个到这个。...
来自于 2024-04-06 17:12:23
0
1
336
CSS中无法显示和移除根节点中的列表项符号（<ul>和<ol>），同时也无法移除overflow-x: hidden的问题 我当前正在处理网页，但我的列表项遇到了问题。通常出现在每个列表项旁边的点和数字没有显示。另外，当我删除overflow-x:hidden;时在我的CSS属性中，列表项数字和点立即显...
来自于 2024-04-04 16:38:22
0
1
3617
如何使用CSS选择器来定位包含特定属性或标签的div元素？ 我正在使用一个生成网站的POS系统。大部分代码是专有的，因此我无法编辑很多内容。我有一个输出的类别列表，其中一些图像作为类别浮动。我想隐藏主页上列出的前3个。我尝试使用div:nt...
来自于 2024-04-03 22:25:59
0
1
277
如何定位侧边栏旁边的 div，以便在侧边栏打开时将 div 推向左侧 每当我打开侧边栏时，主要内容div都会位于侧边栏下方，而不是将其推到右侧，并且div的px应等于侧边栏显示时的宽度。我写了一个css和js函数，但它仍然不起作用。问题就在这里，也许...
来自于 2024-04-03 14:47:21
0
1
325
LESS string-set 的现代等价物是什么 有关字符串集及其用途的示例，请参阅使用LESS字符串集属性和内容方法经过多次困惑，我发现这已经过时了，并且自Chrome版本39以来就没有实现过，尽管它显然在LESS中继续存在。教...
来自于 2024-04-02 13:29:36
0
1
361
相关专题
更多>
热门推荐
热门教程
更多>
相关教程
热门推荐
最新课程
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责声明 Sitemap
PHP中文网：公益在线PHP培训，帮助PHP学习者快速成长！