HTML标签下

(一)表格标签

表格主要用于显示、展示数据

表格的基本语法

<table>
	<tr>
		<td>单元格内的文字</td>
		...
	</tr>
		...
</table>

1.<table> </table> 是用于定义表格的标签。
2.<tr> </tr> 标签用于定义表格中的行，必须嵌套在<table> </table>标签中。
3.<td></td> 用于定义表格中的单元格，必须嵌套在<tr></tr>标签中。
4.字母td 指表格数据（table data），即数据单元格的内容

表头单元格标签

一般表头单元格位于表格的第一行或第一列，表头单元格里面的文本内容加粗居中显示.
<th> 标签表示HTML 表格的表头部分(table head 的缩写

表格属性

属性名	属性值	描述
align	left、center、right	对齐方式
border	1或“”	是否有边框，默认为“”，表示没有边框
cellpadding	像素值	规定单元边沿与其内容之间的空白，默认1像素
cellspacing	像素值	规定单元格之间的空白，默认2像素
width	像素值或百分比	规定表格的宽度

表格结构标签

在表格标签中，分别用：<thead>标签表格的头部区域、<tbody>标签表格的主体区域.

1. <thead></thead>：用于定义表格的头部。
   <thead> 内部必须拥有<tr> 标签。一般是位于第一行。
2. <tbody></tbody>：用于定义表格的主体，主要用于放数据本体。
3. .以上标签都是放在<table></table> 标签中。

合并单元格

合并单元格方式
跨行合并：rowspan=“合并单元格的个数”
跨列合并：colspan="合并单元格的个数

目标单元格：(写合并代码)
跨行：最上侧单元格为目标单元格, 写合并代码
跨列：最左侧单元格为目标单元格, 写合并代码
合并单元格三步曲
1.先确定是跨行还是跨列合并。
2.找到目标单元格. 写上合并方式= 合并的单元格数量。比如：<td colspan=“2”></td>
3.删除多余的单元格

(二)列表标签

无序列表

<ul>
	<li>列表项1</li>
	<li>列表项2</li>
	<li>列表项3</li>
	...
</ul>

1.无序列表的各个列表项之间没有顺序级别之分，是并列的。
2.<ul></ul>中只能嵌套<li></li>，直接在<ul></ul>标签中输入其他标签或者文字的做法是不被允许的。
3.<li>与</li>之间相当于一个容器，可以容纳所有元素。
4.无序列表会带有自己的样式属性，但在实际使用时，我们会使用CSS来设置

有序列表

<ol>
	<li>列表项1</li>
	<li>列表项2</li>
	<li>列表项3</li>
	...
</ol>

1.<ol></ol>中只能嵌套<li></li>，直接在<ol></ol>标签中输入其他标签或者文字的做法是不被允许的。
2.<li>与</li>之间相当于一个容器，可以容纳所有元素。
3.有序列表会带有自己样式属性，但在实际使用时，我们会使用CSS来设置

自定义列表

<dl>
	<dt>名词1</dt>
	<dd>名词1解释1</dd>
	<dd>名词1解释2</dd>
</dl>

1.<dl></dl> 里面只能包含<dt> 和<dd>。
2.<dt> 和<dd>个数没有限制，经常是一个<dt> 对应多个<dd>。

(三)表单标签

表单域

在HTML 标签中，<form> 标签用于定义表单域，以实现用户信息的收集和传递。

<form action=“url地址” method=“提交方式” name=“表单域名称">各种表单元素控件</form>

属性	属性值	作用
action	url地址	用于指定接受并处理表单数据的服务器程序的url地址
method	get/post	用于设置表单的提交方式
name	名称	以区分同一个页面中的多个表单域

表单控件

<input> 表单元素

在<input> 标签中，包含一个type属性，根据不同的type属性值，输入字段拥有很多种形式
（可以是文本字段、复选框、掩码后的文本控件、单选按钮、按钮等）

<input type="属性值">

1.<input /> 标签为单标签
2.type属性设置不同的属性值用来指定不同的控件类型

<label> 标签

<label>标签为input 元素定义标注（标签）。
<label>标签用于绑定一个表单元素, 当点击<label> 标签内的文本时，浏览器就会自动将焦点(光标)转到或者选择对应的表单元素上,用来增加用户体验

<label for="sex">男</label>
<input type="radio" name="sex"id="sex"/>

<label> 标签的for 属性应当与相关元素的id 属性相同

<select> 表单元素
在页面中，如果有多个选项让用户选择，并且想要节约页面空间时，我们可以使用<select>标签控件定义下拉列表.

<select>
	<option>选项1</option>
	<option>选项2</option>
	<option>选项3</option>
	...
</select>

1.<select> 中至少包含一对<option>。
2.在<option> 中定义selected =“selected " 时，当前项即为默认选中项