Question

我想知道为什么Chrome会将样式属性添加到<h>家族的标题元素中。当我添加这样的元素，并且没有特定的css标记时，chrome会添加以下内容：

h3 {
display: block;
font-size: 1.17em;
-webkit-margin-before: 1em;
-webkit-margin-after: 1em;
-webkit-margin-start: 0px;
-webkit-margin-end: 0px;
font-weight: bold;
}

我必须用

之类的东西覆盖它

h3{
    display: block;
    font-size: 1.2em;
    -webkit-margin-before: 0;
    -webkit-margin-after: 0;
    -webkit-margin-start: 0;
    -webkit-margin-end: 0;
    cursor: default;
    font-weight: normal;
}

好的，我可以接受他们将其设置为粗体并增加字体大小的部分，但为什么他们会改变边距呢？

我有时会觉得这很混乱，因为我重新安排了所说的元素，并想知道为什么<p>和<h>的行为不同，因为我忘记了这一点。

或者只是我，我错过了重要部分？

请原谅我的英语，尽我所能。

Answer 1

停用CSS：你会理解为什么浏览器有一个默认样式表（他们选择）。

想象一下列表中列表中的列表没有对项目设置任何padding/margin-left：所有列表项目，无论它们的级别是左对齐还是很难阅读。
在p之间没有1em的边距，你无法判断2组句子是在两个不同的段落中还是只用<br>分开（那个和折叠的边距......只是垂直的）
a带有下划线，并且我们已经习惯了这种蓝色。如果它们没有（带下划线和黑色？

所有这些都定义了一个自然的文本显示，在Lie和Bos发明CSS之前，这是纯HTML所必需的。

至于-start，-end，-before和-after后缀，这只是表示top，right，CSS3 不可知的方式左下角。我不可知的意思是语言可能是RTL（从左到右，像阿拉伯语和希伯来语一样）或LTR（从左到右，如英语或法语）或从上到下的一天和行从左到右，无论主要方向和次要方向如何，您可以在之前说出，浏览器会从上下文中了解它是顶部还是左侧...
但这是浏览器的内部结构：当然margin指令没有前缀，如果您甚至不关心RTL语言，它将与TRBL一起使用 long 时间;）
所以继续简单的事情，如

margin: 1em 10px 1.333em 20px

编辑：
CSS Writing Modes Module Level 3 - Flow-relative Directions的定义：

流量相对方向之前，之后，开始和结束，是相对于页面上的内容流定义的。在LTR“horizontal-tb”写入模式中，它们分别对应于顶部，底部，左和右方向。

为什么chrome会为h *元素添加特定属性？

1 个答案: