1 排版标签
(1) 标题标签
<h1>标题文本</h1>
<h2>标题文本</h2>
<h3>标题文本</h3>
<h4>标题文本</h4>
<h5>标题文本</h5>
<h6>标题文本</h6>
(2) 段落标签
<p></p>
(3) 水平线标签
<hr>
(4) 换行标签br
<br>
(5) 预留格式标签
<pre></pre>
(6) div和span标签
<div></div> <span></span>
没有语义，只是盒子容器，用来装网页元素，div用来布局，但一行只能放一个div，span标签用来布局，一行上可以放多个span,记住使用方法和
特点。
2 文本格式化标签
(1) 粗体显示
<b></b>、<strong></strong>
(2) 斜体显示
<i></i>、<em></em>
(3) 加删除线显示
<s></s>、<del></del>
(4) 加下划线显示
<u></u>、<ins></ins>
(5) 空格
 
3 图像标签<img>
(1) src：图像的路径
(2) alt：图像不能显示时的替换文字
(3) title：鼠标悬停时显示的内容
(4) width：设置图像的宽度
(5) height：设置图像的高度
(6) border：设置边框的宽度
属性不分先后顺序，标签名与属性、属性值之间均以空格分开
任何标签属性都有默认值，省略即为默认值
采取键值对的格式 key="value"
4 链接标签<a></a>
(1) href="目标页"
(2) target="目标窗口弹出方式"
5 拓展
(1) 锚点定位
找目标，定位点 <h3 id=”two”>内容<h3>
创建链接文本，点击对象 <a href=”#id名”>链接文本</a>
(2) Base标签
该标签再<head>中
设置链接的窗口打开方式。设置后所有窗口都起作用。
6 表格
(1) 创建表格
<table>
<tr>
<td>单元格文字内容</td>
</tr>
</table>
tr标签用于定义表格中的行，必须嵌套在table标签中
td用于定义表格中的单元格，必须嵌套在tr标签中
(2) 表格属性
border：设置表格边框（px）
cellspacing：设置单元格和单元格之间的空白间隙（px）
cellpadding：设置单元格内容和单元格之间的空白间隙（px）
width：设置表格的宽度（px）
height：设置表格的高度（px）
align：设置表格的水平对齐方式（left、right、center）（px）
(3) 表头单元格标签th
作用：一般表头单元格位于表格的第一行或第一列，并且文本加粗居中
语法：只需用表头标签th替代相应的单元格标签td即可
(4) 表格标题标签caption
在table开始标签之后，第一行tr的上面，进行书写<caption>个人信息表</caption>
(5) 表格结构标签
thead：表格头部
tbody：表格主体
tfoot：表格底部
表格结构标签内部用于包含tr标签
(6) 合并单元格
<1> 两种方式
<td colspan=" "></td> 跨列合并
<td rowspan=" "></td> 跨行合并
<2> 合并单元格顺序
按照先上后下，先左后右的顺序（目标单元格）
7 表单
(1) 表单域
<form></form>
(2) 表单元素
<1> input输入表单元素
<form>
<input type="" name="">
</form>
type=text文本框
value=提示或名称
type=password密码框
type=radio单选按钮
name=组名,value=返回数据库的值,checked默认
type=checkbox复选框
name=组名,value=返回数据库的值,checked默认
type=submit提交按钮
value=提示或名称
type=reset重置按钮
value=提示或名称
type=button普通按钮
value=提示或名称
type=file文件域
name=名字,accept=上传类型,multiple允许多选
<2> select下拉表单元素
<form>
标题：
<select>
<option>选项</option>
<option>选项</option>
<option>选项</option>
<option selected="selected">选项</option>
</select>
</form>
在<option>中定义selected=“selected”时，当前项即为默认选中项。
<3> textarea表单元素
<form>
标题：
<textarea>请在此输入内容</textarea>
</form>
<4> lable标签
label标签一般用来提升用户体验性，常和input标签联用。主要实现的是，点击label标签包裹的内容，相当于点击了input表单。
性别：<label><input type="radio" name="sex" checked="checked">男 </label><label><input type="radio" name="sex">女</
label>
8 列表
(1) 无序列表
<ul>
<li>列表项</li>
<li>列表项</li>
<li>列表项</li>
<li>列表项</li>
<li>列表项</li>
</ul>
<!--list-style-type:none去掉圆点-->
(2) 有序列表
<ol>
<li>列表项</li>
<li>列表项</li>
<li>列表项</li>
<li>列表项</li>
<li>列表项</li>
</ol>
(3) 自定义列表
<dl>
<dt>列表</dt>
<dd>列表项</dd>
<dd>列表项</dd>
<dt>列表</dt>
<dd>列表项</dd>
<dd>列表项</dd>
</dl>
浙公网安备 33010602011771号