标题标签的默认 CSS 样式是什么? (H1、h2、h3、h4、h5)

问题描述 投票:0回答:5

在 HTML 中,标题用

<H>
(1,2,3,4,5,6) 标签表示。

我的问题是关于以下 HTML 代码:

<div class="pure-u-1-1 pure-u-lg-3-3">
    <h3><form:label path="gen">Registrer Bruker</form:label></h3>
</div>

我不想写

<H3>
,而是想在CSS中写类的属性;提供相同的字体大小(外观和感觉);截至 HTML 标题给出。 CSS 中是否也有相同的预定义属性?

html css
5个回答
36
投票

答案是否定的,但是您可能会修改样式。大多数浏览器都会尝试使用这些样式

(摘自:w3schools

h1 { 
    display: block;
    font-size: 2em;
    margin-top: 0.67em;
    margin-bottom: 0.67em;
    margin-left: 0;
    margin-right: 0;
    font-weight: bold;
}
h2 {
    display: block;
    font-size: 1.5em;
    margin-top: 0.83em;
    margin-bottom: 0.83em;
    margin-left: 0;
    margin-right: 0;
    font-weight: bold;
}
h3 { 
    display: block;
    font-size: 1.17em;
    margin-top: 1em;
    margin-bottom: 1em;
    margin-left: 0;
    margin-right: 0;
    font-weight: bold;
}
h4 { 
    display: block;
    margin-top: 1.33em;
    margin-bottom: 1.33em;
    margin-left: 0;
    margin-right: 0;
    font-weight: bold;
}
h5 { 
    display: block;
    font-size: .83em;
    margin-top: 1.67em;
    margin-bottom: 1.67em;
    margin-left: 0;
    margin-right: 0;
    font-weight: bold;
}
h6 { 
    display: block;
    font-size: .67em;
    margin-top: 2.33em;
    margin-bottom: 2.33em;
    margin-left: 0;
    margin-right: 0;
    font-weight: bold;
}

3
投票

CSS 中是否有相同的预定义属性;其外观和感觉与 H 相同?

没有。

标题的默认样式(在大多数浏览器中)正是:不同 CSS 规则的集合加上

Hn
选择器(并存储在浏览器样式表中)。

没有一种(纯 CSS)方法可以自动复制所有这些规则。

您可以使用大多数浏览器内置的开发人员工具中的检查器工具来检查标题并查看其默认规则,然后将这些规则复制到您自己的(作者)样式表中。

浏览器之间可能存在一些差异,因此您通常也需要明确设置

Hn
规则。


0
投票
Instagram

登录

*登录Instagram *
123456789
  1. Instagram🆔
  2. 创建密码

-2
投票

问题:CSS 中是否有相同的预定义属性?

没有

你可以这样尝试:

h3{ 
   display: block; 
}

h3 {
   font-size: /*Font size similar to h3*/ ;
}

-6
投票

认为一个好的做法是让 h<1-6> 保留其默认样式。然后添加一个类来添加额外的样式。对我来说似乎更干净,而且你并没有破坏“大师风格”。我确定优点和缺点。

你好CSS

© www.soinside.com 2019 - 2024. All rights reserved.