HTML学习(二)

HTML表格标签

作用：展示、显示数据、

表格：表格的基本语法

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

标签写法	标签名
<table></table>	定义表格标签
<tr></tr>	定义表格中的行，需嵌套在table标签
<td></td>	定义表格数据，需嵌套在tr标签
<th></th>	表示表格表头
<thead></thead>	表示表格头部区域
<tbody></tbody>	表示表格主体部分

合并单元格方法

1.跨行rowspan=”合并单元格的个数”、跨列合并colspan=”合并单元格的个数”

2.找到目标单元格<td coslpan="2" ></td>（以上面和左面为目标）

3.删除多余的单元格

HTML列表标签

无序列表

写法

<ul>
    <li>1</li>
    <li>2</li>
    ...
    <li>n</li>
</ul>

特点

并列

ul中只有li，li中可以有所有元素

有序列表

写法

<ol>
    <li>1</li>
    <li>2</li>
    ...
    <li>n</li>
</ol>

特点

有序

ol中只有li，li中可以有所有元素

自定义列表

写法

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

dl里只有dd和dt

HTML表单标签

组成:

表单域、表单控件、提示信息

写法：

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

表单域

常用属性

属性	属性值	作用
action	url地址	用于制定接收并处理数据的服务器url地址
method	get/post	用于设置提交方式
name	名称	用于指定表单名称，用于区分

表单控件

input输入表单元素

写法：

<input type="属性值" 。。。 />

属性	属性值	作用
type	属性值	定义
name	用户定义	描述名称
value	用户定义	规定元素的值
checked	checked	首次被选中
maxlength	正整数	规定字符最大长度

name和value是必备属性，主要由后台人员使用

单复选框要有相同的name

check针对单复选框

type：

属性值	作用
bottom	定义可点击按钮
checbox	定义复选框
file	定义输入字段和浏览按钮，供文件上传
hidden	定义隐藏的输入字段
image	定义图像提交
password	定义密码字段
radio	定义单选按钮
reset	定义按钮重置表单数据
submit	定义提交按钮，发送数据到服务器
text	定义单行输入字段

<lable>标签

为input元素定义标注

用于绑定一个表单元素，点击lable内文本时，浏览器自动选择对于表单元素，增加用户体验

用法：

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

select下拉表单元素

语法：

<select>
    <option>opt1</option>
    <option>opt2</option>
    .
    .
    .
    <option>optn</option>
</select>

至少包含一个option

在option中设定selected = “selected”为默认选项

textarea文本域表单元素

语法：

<textarea row="3" cols="20">
    xxx
</textarea>