html5标签怎么使用
HTML has only a few dozen elements, but we busy developers often forget to use the right tag for the job in hand. It’s all too easy to add a <div> or a <span> when there are more suitable alternatives.
HTML仅包含几十个元素，但是我们忙碌的开发人员常常忘记使用正确的标签来完成工作。 当有更合适的替代方法时，添加<div>或<span>太容易了。
Here are five tags that may be missing from your HTML arsenal…
这是您HTML武库中可能缺少的五个标签…
1. <label> Every visible field in your <form> should have a <label>, e.g.
1. <label> <form> <label>每个可见字段都应有一个<label> ，例如
<label for="email" title="enter your email">email:</label> <input type="text" id="email" name="email" />The <label> is associated with the field’s ID using the for attribute. An optional title attribute can be used to provide further information if necessary.
<label>使用for属性与字段的ID关联。 如有必要，可以使用可选的title属性提供更多信息。
Labels are useful for accessibility and clicking them sets focus to the field. In the case of checkboxes and radio buttons, the clicking the label will change the field’s state, e.g.
标签对于可访问性很有用，单击它们会将焦点设置到该字段。 对于复选框和单选按钮，单击标签将更改字段的状态，例如
<p>Choose your preferred newsletter format:</p> <input type="radio" id="format_1" name="format" value="html" checked="checked" /> <label for="format_1">HTML format</label> <input type="radio" id="format_2" name="format" value="plain" /> <label for="format_2">plain text format</label>Any number of labels can be associated with a single field. This could be useful when displaying validation error messages.
任何数量的标签都可以与一个字段相关联。 显示验证错误消息时，这可能很有用。
2. <fieldset> and <legend> Forms fields can be grouped into one or more logical sections using <fieldset>. It is important to note that fields such as <input>, <select> and <textarea> should be wrapped in a block-level element such as a <fieldset> rather than the <form> element itself.
2. <fieldset>和<legend>可以使用<fieldset>将Forms字段分为一个或多个逻辑部分。 重要的是要注意，诸如<input> ， <select>和<textarea>字段应包装在诸如<fieldset>类的块级元素中，而不是<form>元素本身。
The <legend> element adds a caption title to a <fieldset>. Example:
<legend>元素将标题标题添加到<fieldset> 。 例：
<form action="formhandler.php" method="post"> <fieldset> <legend>Personal Details</legend> <label for="name">Name:</label> <input type="text" id="name" name="name" /> <label for="age">Age:</label> <input type="text" id="age" name="age" /> </fieldset> <fieldset> <legend>Career</legend> <label for="job">Job title:</label> <input type="text" id="job" name="job" /> <label for="company">Company:</label> <input type="text" id="company" name="company" /> </fieldset> </form>3. <optgroup> <select> box <option> elements can be grouped into one or more logical sections using the <optgroup> tag. The label attribute assigns a heading to the optgroup.
3. <optgroup> <select>框<option>元素可使用<optgroup>标记分为一个或多个逻辑部分。 label属性将标题分配给optgroup。
<label for="skillset">Your primary skillset:</label> <select id="skillset" name="skillset"> <optgroup label="web design"> <option value="ps">PhotoShop</option> <option value="il">Illustrator</option> <option value="il">Fireworks</option> </optgroup> <optgroup label="web development"> <option value="html">HTML</option> <option value="css">CSS</option> <option value="js">JavaScript</option> <option value="net">ASP.NET</option> <option value="php">PHP</option> </optgroup> </select>4. <dl>, <dt>, and <dd> Definition lists, such as dictionaries or contact details, can be created using <dl>. Each list should contain at least one definition term, <dt>, and definition description, <dd>, e.g.
4. <dl> ， <dt>和<dd>定义列表，例如字典或联系方式，可以使用<dl>创建。 每个列表应至少包含一个定义术语<dt>和定义描述<dd> ，例如
<dl> <dt>HTML</dt> <dd>Your content is defined in Hyper-Text Mark-up Language</dd> <dt>CSS</dt> <dd>Your layout is defined using Cascading Style Sheets</dd> <dt>JavaScript</dt> <dd>Client-side functionality is implemented using JavaScript</dd> </dl>5. <q> and <cite> <q> is similar to <blockquote> but it is used for a short quotation. <cite> contains a citation or a reference to another source, e.g.
5. <q>和<cite> <q>与<blockquote>相似，但是用于短引用。 <cite>包含对其他来源的引用或引用，例如
<p><cite>Bill Gates</cite> said <q>640K ought to be enough for anybody</q>.</p>See also: HTML: The Top 5 Forgotten Elements.
另请参阅： HTML：被遗忘的5大元素 。
Have I missed your favourite under-used tag?
我错过了您最喜欢的未使用标签吗？
翻译自: https://www.sitepoint.com/five-under-used-html-tags/
html5标签怎么使用
