学习HTML5这一篇就够了( 二 ) _HTML5

2.3、标签规范单标签：
<标签名 [属性名=属性值,...]>
成对标签：
<标签名 [属性名=属性值,...]></标签名>
第三章 HTML5标签3.1、标题标签<h1>这是一级标题</h1>
<h2>这是二级标题</h2>
<h3>这是三级标题</h3>
<h4>这是四级标题</h4>
<h5>这是五级标题</h5>
<h6>这是六级标题</h6>
3.2、段落标签<p>这是一个段落</p>
3.3、链接标签使用示例：
<a href=https://www.isolves.com/it/cxkf/ydd/html5/2022-02-28/"百度一下，你就知道">打开百度，你就知道！
常见属性：

属

文章插图

3.4、图像标签<img src=https://www.isolves.com/it/cxkf/ydd/html5/2022-02-28/"
https://www.baidu.com/img/PCtm_d9c8750bed0b3c7d089fa7d55720d6cf.png" alt="百度LOGO">
3.5、表格标签<table border="1px" cellpadding="0px" cellspacing="0px">
<tr>
<th>表头一</th>
<th>表头二</th>
<th>表头三</th>
<th>表头四</th>
</tr>
<tr>
<td>单元格一</td>
<td>单元格二</td>
<td>单元格三</td>
<td>单元格四</td>
</tr>
</table>
3.6、列表标签无序列表：
<ul>
<li>列表项</li>
<li>列表项</li>
<li>列表项</li>
<li>列表项</li>
</ul>
有序列表：
<ol>
<li>列表项</li>
<li>列表项</li>
<li>列表项</li>
<li>列表项</li>
</ol>
自定义列表：
<dl>
<dt>+</dt><dd>列表项</dd>
<dt>+</dt><dd>列表项</dd>
<dt>+</dt><dd>列表项</dd>
</dl>
3.7、分组标签<div>具体内容</div>
<span>具体内容</span>
3.8、语义标签常见标签：

文章插图

基本布局：

文章插图

3.9、表单标签常见标签：

文章插图

案例演示：
1、form、input、label演示
<form action="" method="get">
<p>
<label for="username">账户：</label>
<input type="text" name="username" id="username">
</p>
<p>
<label for="password">密码：</label>
<input type="password" name="password" id="password">
</p>
<p><input type="submit"></p>
</form>

2、textarea演示
<form action="" method="post">
<textarea name="mycontext" cols="30" rows="10"></textarea>
<input type="submit">
</form>

3、fieldset、legend、select、optgroup、option演示
<form action="" method="post">
<fieldset>
<legend>请选择你的爱好：</legend>
<select name="myhobby" id="myhobby">
<optgroup label="运动">
<option value=https://www.isolves.com/it/cxkf/ydd/html5/2022-02-28/"篮球">篮球
<option value=https://www.isolves.com/it/cxkf/ydd/html5/2022-02-28/"足球">足球
</optgroup>
<optgroup label="电子">
<option value=https://www.isolves.com/it/cxkf/ydd/html5/2022-02-28/"看电影">看电影
<option value=https://www.isolves.com/it/cxkf/ydd/html5/2022-02-28/"看电视">看电视
</optgroup>
</select>
</fieldset>
</form>

4、datalist演示
<form action="" method="post">
<input list="browsers">
<datalist id="browsers">
<option value=https://www.isolves.com/it/cxkf/ydd/html5/2022-02-28/"Internet Explorer">
<option value=https://www.isolves.com/it/cxkf/ydd/html5/2022-02-28/"Firefox">
<option value=https://www.isolves.com/it/cxkf/ydd/html5/2022-02-28/"Chrome">