为什么不能在html中重命名<header>标签?

时间:2016-01-27 08:31:24

标签: html css html5 tags

在以下代码中,除了<header>之外的样式标记内定义的所有标记都可以重命名,

    <!DOCTYPE html>
    <html>
    <head>
    <style>
    header {
    background-color:black;
    color:white;
    text-align:center;
    padding:5px;     
    }
    nav {
    line-height:30px;
    background-color:#eeeeee;
    height:300px;
    width:100px;
    float:left;
    padding:5px;          
    }
    section {
    width:350px;
    float:left;
    padding:10px;        
    }
    footer {
    background-color:black;
    color:white;
    clear:both;
    text-align:center;
    padding:5px;         
    }
    </style>
    </head>
    <body>

    <header>
    <h1>City Gallery</h1>
    </header>

    <nav>
    London<br>
    Paris<br>
    Tokyo
    </nav>

    <section>
    <h1>London</h1>
    <p>London is the capital city of England. It is the most populous city in the United Kingdom, with a metropolitan area of over 13 million inhabitants.</p>
    <p>Standing on the River Thames, London has been a major settlement for two millennia, its history going back to its founding by the Romans, who named it Londinium.</p>
    </section>

    <footer>
    Copyright © W3Schools.com
    </footer>

    </body>
    </html>

如果我将<nav>标记重命名为<mytag>,那么代码呈现的方式与之前相同。但是,如果我将<header>标记重命名为<myheader>,则它不会像以前那样呈现代码。为什么会这样? <header>标记有什么特别之处?

1 个答案:

答案 0 :(得分:1)

你可以。只需改变

header {
  background-color:black;
  color:white;
  text-align:center;
  padding:5px;     
}

myheader {
  background-color:black;
  color:white;
  text-align:center;
  padding:5px;  
  display: block;
}

注意“display:block”

这是一个JSFiddle:https://jsfiddle.net/urL383L7/1/