标签
(1)排版标签
<h1></h1>
<!-- 文字加粗 1~6字号逐渐减小 独占一行(换行) -->
<p></p>
<!-- 独占一行 段落之间存在间隙 -->
<br>
<hr>
<!-- 1.加粗 -->
<strong></strong> <b></b>
<!-- 2.倾斜 -->
<em></em> <i></i>
<!-- 3.下划线 -->
<ins></ins> <u></u>
<!-- 4.删除线 -->
<del></del> <s></s>
(2)多媒体标签
<img src="" alt="" title="" width="" height="">
<!-- 属性 —— src:图片URL,必须属性 alt:替换文本 title:提示文本 width:图片宽度 height:图片高度 -->
<a href="" target=""></a>
<!-- 属性 —— href:跳转地址,必须属性 href="#":空链接 targer="_blank":在新窗口打开 target="_self":在原窗口打开 -->
<audio src="" controls loop autoplay></audio>
<!-- 属性 —— src:音频URL controls:音频控制面板 loop:循环播放 autoplay:自动播放 -->
<video src="" controls loop autoplay></video>
<!-- 属性 —— src:视频URL controls:音频控制面板 loop:循环播放 autoplay:自动播放 -->
(3)嵌套关系标签
<!-- 1.无序 ul:无序列表(只能包裹li标签) li:列表条目(可包裹任何内容)-->
<ul>
<li></li>
</ul>
<!-- 2.有序 ol:有序列表(只能包裹li标签) li:列表条目(可包裹任何内容) -->
<ol>
<li></li>
</ol>
<!-- 3.定义 dl:定义列表(只能含有dt和dd) dt:定义列表的标题 dd:定义列表的描述/详情(dt/dd里可包含任何内容) -->
<dl>
<dt></dt>
<dd></dd>
</dl>
<!-- table:表格 tr:行 th:表头单元格 td:内容单元格 (表格默认没有边框线,使用border属性为表格添加边框线)-->
<!-- thead:表格头部内容 tbody:表格主体,主要内容区域 tfoot:表格底部,汇总信息区域 -->
<!-- 合并表格单元格:保留最左最上的单元格,添加以下属性(取值是数字,表需要合并的单元格数量) 注意:不能跨表格结构标签合并单元格(thead,tbody,tfoot) -->
<!-- 跨行合并:rowspan(保留最上单元格) 跨列合并:colspan(保留最左单元格) -->
<table border="1">
<tr>
<td></td>
</tr>
</table>
<table>
<tr>
<th></th>
</tr>
</table>
<!--1. input -->
<!-- input标签type属性值不同,则功能不同 -->
<!-- type属性值 —— text:文本框,用于输入单行文本 password:密码框 radio:单选框 checkbox:多选框 file:上传文件 -->
<!-- placeholder="" 占位文本:提示信息,文本款和密码框都可以使用-->
<input type="" placeholder="">
<!-- radio:单选框 name:控件名称,控制分组,同组只能选中一个(单选功能,自定义) checked:默认选中,属性名和属性值相同,简写为一个单词 -->
<input type="radio" name="gender" checked>男
<input type="radio" name="gender" >女
<!-- chechbox:多选框 checked:默认选中,属性名和属性值相同,简写为一个单词-->
<input type="checkbox" checked>敲代码
<!-- file:上传文件 multiple:实现文件多选上传 -->
<input type="file" multiple>
<!--2. 下拉菜单 -->
<!-- select:下拉菜单整体 option:下拉菜单的每一项 selected属性:实现默认选中功能 -->
<select>
<option>上海</option>
<option>北京</option>
<option>深圳</option>
<option selected>广州</option>
</select>
<!--3. 文本域:多行输出文本的表单控件 -->
<textarea>可填默认在文本域的提示文字</textarea>
<!--4. label:网页中,某个标签的说明文本,用label标签绑定文字和表单控件的关系,增大表单控件的点击范围 -->
<!-- 支持label标签增大点击范围的表单控制件:文本框,密码框,上传文件,单选框,多选框,下拉菜单,文本域等等 -->
<!-- 写法一:label标签只包裹内容,不包裹表单控件 设置label标签的for属性值和表单控件的id属性值相同 -->
<input type="radio" id="man">
<label for="man">男</label>
<!-- 写法二:使用label标签包裹文字和表单控件,不需要属性 -->
<label><input type="radio">女</label>
<!--5. button:按钮 -->
<!-- type属性值 submit:提交按钮,点击后可以提交数据到后台(默认功能) reset:重置按钮,点击将表单控件恢复默认值 button:普通按钮,默认没有功能,一般配合JavaScript使用 -->
<button type="">按钮</button>
<!-- 按钮需要配合form标签(表单区域)使用才能实现对应功能 -->
<!--6. form:表单区域 action:发送数据的地址 -->
<form action="">
用户名: <input type="text">
<br><br>
密码: <input type="password">
<br><br>
<!-- 如果省略type属性,功能就是提交按钮 -->
<button type="submit">提交</button>
<button type="reset">重置</button>
<button type="button">普通按钮</button>
</form>
<!-- 无语义的布局标签:布局网页(划分网页区域,摆放内容) -->
<div>div标签,独占一行</div>
<span>span标签,不换行</span>
<!--字符实体 空格 <小于号; >大于号 -->
<
>