正确使用 <header> HTML5中的标签
[英]Right usage of the <header> tag in HTML5
问题描述
I have read that the tag is the header of a section. 
我读过，标签是一节的标题。 It could be used more then 1 time in the document. 在文档中可以使用1次以上。
Should I use the <header> tag in the section: 我应该在本节中使用<header>标记：
<section>
<header>
</header>
</section>
or above the <section> like: 或在<section>上方，例如：
<header>
</header>
<section>
</section>
Is it possible to have this sctucture for heading information and the sections: 是否可以使用此结构来获取标题信息和以下各节：
<section id="main">
<header id="results">
<h1>My Results</h1>
</header>
<section id="results">
<section id="result1">
<h2>Title</h2>
<div class="body"></div>
</section>
<section id="result2">
<h2>Title</h2>
<div class="body"></div>
</section>
.
.
.
</section>
</section>
do you thing this example is a good one for semantic usage oh the HTML5 tags header and section? 您觉得此示例对于语义用法来说是一个很好的例子吗？HTML5标签的标头和部分？
Or should I use instead of the <section id="main"> , the <main> tag? 还是应该使用<main>标记代替<section id="main"> ？
2 个解决方案
解决方案1
1 2014-04-17 14:03:42
Your two cases have a different meaning: 您的两种情况具有不同的含义：
Here the section has a header : 这section有一个header ：
<section>
<header>
</header>
</section>
Here the parent section (*) has a header and a child section (which has no header ): 此处的父节 （*）有一个header和一个子section （没有header ）：
<header>
</header>
<section>
</section>
(* Could be a sectioning element like article / section / nav / aside , or a sectioning root like body /etc.) （*可以是section元素，例如article / section / nav / aside ，或者是section root，例如body / etc。）
Both cases are possible, it depends on the meaning of your content. 两种情况都是可能的，这取决于您内容的含义。
See my answer to a related question, which contains an example document with different header elements. 请参阅我对一个相关问题的回答，其中包含具有不同header元素的示例文档。
解决方案2
0 2014-04-17 11:57:56
Don't use section as a wrapper for styling. 不要将section用作样式的包装。 correct way is 正确的方法是
<body>
<header>
<h1>Header in h1</h1>
<h2>Subheader in h2</h2>
</header>
<section>
<article>
<header>
<h1>Article #1</h1>
</header>
<section>
This is the first article.
</section>
</article>
<article>
<header>
<h1>Article #2</h1>
</header>
<section>
This is the second article.
</section>
</article>
</section>
<aside>
<section>
<h1>Links</h1>
<ul>
<li><a href="#">Link 1</a></li>
<li><a href="#">Link 2</a></li>
<li><a href="#">Link 3</a></li>
</ul>
</section>
</aside>
<footer>Footer</footer>
</body>
About section and header click here and for html5 possible mistakes here 关于部分和头点击这里和HTML5可能出现的错误这里
Your html should be 您的html应该是
<body>
<header>
<h1>Search Form</h1>
</header>
<section id="content">
<h1>Search Result Title</h1>
<ul id="sponsored_ads">
<li></li>
<li></li>
</ul>
<ul id="organic_ads">
<li></li>
<li></li>
</ul>
<article id="left_menu_1">
<ul>
<li></li>
<li></li>
</ul>
</article>
<article id="left_menu_2>
<ul>
<li></li>
<li></li>
</ul>
</article>
</section>
<footer></footer>
</body>
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.