0

HTML5ify 的最佳方法是什么?

follow: Go or come after (a person or thing proceeding ahead); move or travel behind.

"She went back into the house, and Ben followed her."

这个?

<article>
<dfn>follow</dfn>: Go or come after (a person or thing proceeding ahead); move or travel behind.
<q>"She went back into the house, and Ben followed her."</q>
</article>
4

2 回答 2

1

除非您的定义更广泛,如百科全书文章(例如,wiki),否则我不会称它为文章,因为<article>标签:

Represents a section of a page that consists of a composition that forms an     
independent part of a document, page, or site. This could be a forum post, 
a magazine or newspaper article, a Web log entry, a user-submitted comment, 
or any other independent item of content.

对于书籍或白皮书的附录中可能包含的一系列简短定义,我建议使用数据定义列表:<dl>宽度<dt><dd>分别标记术语和定义。

参考:http ://html5doctor.com

有很多关于如何最好地使用 HTML5 标签的讨论,使阅读变得有趣。

我如何设计这个

如果我要为词汇表制作一个简单的定义列表,我可能会从以下内容开始:

<dl>
   <dt><dfn>follow</dfn>:</dt>
    <dd>
        <p>Go or come after (a person or thing proceeding ahead); move or travel
            behind.</p>
        <q>She went back into the house, and Ben followed her.</q>
    </dd>
</dl>

并应用如下样式:

dl {
    border: 1px solid #989898;
    border-radius: 10px;
    padding: 1.00em;
}
dt {
    margin-left: 1.00em;
}
dfn {
    font-weight: bold;
    font-size: 1.25em;
}
dd {
    margin-left: 2.00em;
    margin-bottom: 3.00em;
}
dd p {
    margin: 0 0 0.50em 0;
}
dd q {
    display: block;
    margin: 0 0 0.50em 0;
    font-style: italic;
}

这只是说明您对布局中的各种元素有多大的灵活性和控制力。

小提琴参考:http: //jsfiddle.net/audetwebdesign/H6593/

于 2013-03-26T11:02:34.557 回答
0

不需要 HTML5 元素,这是旧的dl,dtdd.

例如

<dl>
    <dt>Thing one</dt>
    <dd>
        <p>This defines thing one.</p>
    </dd>

    <dt>Thing two</dt>
    <dd>
        <p>This defines thing two.</p>
    </dd>
</dl>

dl是定义列表,dt是定义术语,dd是定义描述。

于 2013-03-26T11:00:03.610 回答