h1标签小于h2,都在section标签内

时间:2013-12-17 19:07:45

标签: html css tags

我的h1标签是insode的一个标签,比h2标签小。当在section标签外面时,h1标签的大小正确。我一直在浏览我的CSS页面,但没有找到任何可以实现这一点的内容。这是我的CSS页面:

body 
{
    font: 100%/1.4 Verdana, Arial, Helvetica, sans-serif;
    background-color: #42413C;
    margin: 0;
    padding: 0;
    color: #000;
    background-image: url(images/mass_effect_1_citadel_dreamscene_by_droot1986-d5sw7hu.jpg);
}

a img 
{
    border: none;
}

.container 
{
    width: 960px;
    background-color: #192370;
    margin: 0 auto;
}

header 
{
    background-color: #050a2e;
}

.sidebar1 
{
    float: left;
    width: 175px;
    background-color: #2236d1;
    padding-bottom: 10px;
    border: solid thin black;
    text-align: center;
}

.content 
{
    padding: 10px 0;
    width: 780px;
    float: right;
    border: solid thin black;
}

footer 
{
    padding: 10px 0;
    background-color: #050a2e;
    position: relative;
    clear: both;
    text-align: center;
}

header, section, footer, aside, article, figure 
{
    display: block;
    color: white;
}

a:link
{
    text-decoration: none;
    color: #d1bd22;
    font-size: 1.3em;
}

a:visited
{
    text-decoration: none;
    color: white;
    font-size: 1.3em;
}

a:hover
{
    text-decoration: underline;
    color: #d1bd22;
    font-size: 1.3em;
}

a:active
{
    text-decoration: underline;
    color: white;
    font-size: 1.3em;
}

非常感谢任何帮助

1 个答案:

答案 0 :(得分:5)

如果您在没有样式表的情况下测试情况,您会看到h1元素中的section以较小的字体显示。这是由支持section的浏览器和HTML5中的suggested rendering的浏览器样式表引起的。已经定义了section element,因此{@ 1}}元素是部分的标题,因此相对于整个页面,它位于第2级(如果h1元素已嵌套,则甚至在较低级别。

关于这种方法的充分性有各种各样的意见,但这就是HTML5草案所说的以及一些浏览器已经实现的内容。另一方面,旧浏览器忽略了这些规则,因此该方法实际上并不健壮。使用section作为章节标题更安全(并且根据HTML5完全可以接受)。