是否建议使用更多HTML5部分或更少的部分? [英] Is it advised to have more HTML5 section elements or less?
问题描述
在创建HTML5时使用更多标签或更少标签会更好吗?
我读过任何相关内容都应该包含在< section>
中,请在下面检查,一种变体是
我知道有些人说最好有更多的标签,有些人会说更少,但是有一个普遍接受的规则吗?
< section class =bodyid =contact>
< section id =contact_us_form>
< header>
< h1>联系我们< / h1>
< hr />
< / header>
< p>
与基金会取得联系< br />与您的
问题和查询
< / p>
< form action =>
< input type =textname =nameplaceholder =name
autocomplete =onautofocus =on> < input type =textname =email
placeholder =email>
< button class =submittype =submitformaction => SEND MESSAGE< / button>
< / form>
< / section>
< section id =contact_details>
< section id =email_address>
< h1> EMAIL< / h1>
< p> test@email.com< / p>
< / section>
< section id =postal_address>
< h1> ADDRESS< / h1>
< address class =vcard>
< div class =adr>
< div class =center-name> name< / div>
< div class =street-address> 2道路名称< / div>
< div class =locality>城市< / div>
< / div>
< / address>
< / section>
< section id =phone_number>
< h1> PHONE:< / h1>
< p> + 12345678< / p>
< / section>
< / section>
< / section>
或
< section class =bodyid =contact>
-
< section id =contact_us_form>
< h1>联系我们< / h1>
< hr />
< p>
与基金会取得联系< br />与您的
问题和查询
< / p>
< form action =>
< input type =textname =nameplaceholder =name
autocomplete =onautofocus =on> < input type =textname =email
placeholder =email>
< button class =submittype =submitformaction =>发送消息< /按钮>
< / form>
< / section>
< section id =contact_details>
< h1> EMAIL< / h1>
< p> test@email.com< / p>
< h1> ADDRESS< / h1>
< address class =vcard>
< div class =adr>
< div class =center-name> name< / div>
< div class =street-address> 2道路名称< / div>
< div class =locality>城市< / div>
< / div>
< / address>
< h1> PHONE:< / h1>
< p> + 12345678< / p>
< / section>
< / section>每当(*)你使用一个标题(<$($))时, c $ c> h1h6
),您也可以使用部分
(** )来包装这个标题及其内容。您可以在我的回答中阅读有关此问题的更多信息。
可能,而不是必须。
HTML5(CR)规范表示:
还鼓励作者在切片内容的元素中显式包装切片,而不是依靠通过在切片内容的一个元素中包含多个标题而生成的隐式切片。
所以鼓励 ,对您的问题 yes 。
b
$ b(*除了网站标题,即
body
的子标题,且没有其他分区内容元素。)
(**除非内容适用于
文章
,一边
或nav
。)
我发现任何相关内容都应该包含在
< section>
[...] p>
这是不正确的。 相关可能意味着很多事情。 按照规范中的定义请注意
部分
(以及其他部分元素文章
,不要
和nav
)在生成文档中发挥作用 outline 。Is it better to use more tags or less tags when creating HTML5?
I read that any related content should be wrapped in
<section>
, please check below, one variant is with less tags, second with more tags.I know some people say is better to have more tags, some people say less, but is there a general accepted rule?
<section class="body" id="contact"> <section id="contact_us_form"> <header> <h1>CONTACT US</h1> <hr /> </header> <p> Get in touch with the Foundation<br /> with your questions and queries </p> <form action=""> <input type="text" name="name" placeholder="name" autocomplete="on" autofocus="on"> <input type="text" name="email" placeholder="email"> <textarea name="message" placeholder="message"></textarea> <button class="submit" type="submit" formaction="">SEND MESSAGE</button> </form> </section> <section id="contact_details"> <section id="email_address"> <h1>EMAIL</h1> <p>test@email.com</p> </section> <section id="postal_address"> <h1>ADDRESS</h1> <address class="vcard"> <div class="adr"> <div class="center-name">name</div> <div class="street-address">2 road name</div> <div class="locality">city</div> </div> </address> </section> <section id="phone_number"> <h1>PHONE:</h1> <p>+12345678</p> </section> </section> </section>
Or
<section class="body" id="contact"> <section id="contact_us_form"> <h1>CONTACT US</h1> <hr /> <p> Get in touch with the Foundation<br /> with your questions and queries </p> <form action=""> <input type="text" name="name" placeholder="name" autocomplete="on" autofocus="on"> <input type="text" name="email" placeholder="email"> <textarea name="message" placeholder="message"></textarea> <button class="submit" type="submit" formaction="">SEND MESSAGE</button> </form> </section> <section id="contact_details"> <h1>EMAIL</h1> <p>test@email.com</p> <h1>ADDRESS</h1> <address class="vcard"> <div class="adr"> <div class="center-name">name</div> <div class="street-address">2 road name</div> <div class="locality">city</div> </div> </address> <h1>PHONE:</h1> <p>+12345678</p> </section> </section>
解决方案Whenever (*) you use a heading (
h1
-h6
), you may also usesection
(**) to wrap this heading and its content. You can read more about this in my answer to a smiliar question.May, not must.
The HTML5 (CR) spec says:
Authors are also encouraged to explicitly wrap sections in elements of sectioning content, instead of relying on the implicit sections generated by having multiple headings in one element of sectioning content.
So it’s encouraged, which is a yes to your question.
(* Except for the site heading, i.e., the heading which is a child of
body
and of no other sectioning content element.)(** Unless the content is appropriate for
article
,aside
ornav
.)
I read that any related content should be wrapped in
<section>
[…]This is not true. "Related" can mean many things. Follow the definition in the spec. Be aware that
section
(and the other sectioning elementsarticle
,aside
andnav
) play a role in generating the document outline.这篇关于是否建议使用更多HTML5部分或更少的部分?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!