我有一大堆的网页看起来这个语义:
Heading A
Textual information related to heading A.
Blah blah blah blah blah.[image gallery related to heading A]
我可以想到几个方法来标记这一点:
方法1:
<section> <h1>Heading A</h1> <p>Textual information related to heading A.<br /> <p>Blah blah blah blah blah.</p> <figure> <img /> <figcaption>Image 1</figcaption> <img /> <figcaption>Image 2</figcaption> </figure> </section>
方法2:
<section> <h1>Heading A</h1> <p>Textual information related to heading A.<br /> <p>Blah blah blah blah blah.</p> <figure> <img /> <figcaption>Image 1</figcaption> <figure> </figure> <img /> <figcaption>Image 2</figcaption> </figure> </section>
方法3:
<section> <h1>Heading A</h1> <p>Textual information related to heading A.<br /> <p>Blah blah blah blah blah.</p> <aside> <!--Method 3b: use section here--> <figure> <img /> <figcaption>Image 1</figcaption> <figure> </figure> <img /> <figcaption>Image 2</figcaption> </figure> </aside> <!--Method 3b: use section here--> </section>
方法4:
<section> <h1>Heading A</h1> <p>Textual information related to heading A.<br /> <p>Blah blah blah blah blah.</p> </section> <aside> <figure> <img /> <figcaption>Image 1</figcaption> <figure> </figure> <img /> <figcaption>Image 2</figcaption> </figure> </aside>
哪个是语义上正确的方法呢?
解决方法
您不可能以“一个真正的方式”完全达成一致,以标记这一点,但我会选择方法2.我的推理是:
图形元素不能有多个figcaption子元素,因此方法1无效
>一个数字已经是一种类型,所以不需要包装它们:“图形元素代表一个内容单元,可以从文档的主要流程移开而不影响文档的含义。” (W3C HTML5 spec,figure element)>除非这两个数字本身是相关的,除了两者都与他们所在的部分相关,否则不需要将它们分组到更远的位置
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。