表格
表格标签
表格标签
描述
表格的最外层容器
定义表格行
定义表头
定义表格单元
定义表格表题
代码:
| 日期 | 天气情况 | 出行情况 |
|---|---|---|
| 2020/1/1 |  | 天气晴朗,适合出行 |
| 2020/1/2 |  | 有小雨,出门请带伞 |
输出:
天气情况
日期
天气情况
出行情况
2020/1/1
天气晴朗,适合出行
2020/1/2
有小雨,出门请带伞
语义化标签
不会产生效果,更会符合html规范
语义化标签
描述
表格头部
表格主题
表格结束
代码:
日期天气情况出行情况
2020/1/1天气晴朗,适合出行2020/1/2
有小雨,出门请带伞
其中tbody是可以出现多次的,thead和tfoot只能出现一次
表格属性:边框和单元格的大小
属性
含义
border
表格边框
cellpadding
单元格内的空间
cellspacing
单元格之间的空间
代码:
日期天气情况出行情况
2020/1/1天气晴朗,适合出行2020/1/2
有小雨,出门请带伞
输出:
天气情况
日期
天气情况
出行情况
2020/1/1
天气晴朗,适合出行
2020/1/2
有小雨,出门请带伞
表格属性:单元格的合并
行合并
代码:
日期天气情况出行情况
2020/1/1白天天气晴朗,适合出行2020/1/2白天
有小雨,出门请带伞
输出:
天气情况
日期
天气情况
出行情况
2020/1/1
白天
天气晴朗,适合出行
2020/1/2
白天
有小雨,出门请带伞
合并列
代码
日期天气情况出行情况
2020/1/1白天天气晴朗,适合出行夜晚
天气晴朗,适合出行2020/1/2白天
有小雨,出门请带伞夜晚
有小雨,出门请带伞
输出:
天气情况
日期
天气情况
出行情况
2020/1/1
白天
天气晴朗,适合出行
夜晚
天气晴朗,适合出行
2020/1/2
白天
有小雨,出门请带伞
夜晚
有小雨,出门请带伞
表格属性:单元格对齐方式
align
属性值
left
左
center
中
right
右
valign
属性值
top
上
middle
中
bottom
下
这些属性,放在不同的标签上,所影响的范围不同
代码:
日期天气情况出行情况
2020/1/1白天天气晴朗,适合出行夜晚
天气晴朗,适合出行2020/1/2白天
有小雨,出门请带伞夜晚
有小雨,出门请带伞
输出:
天气情况
日期
天气情况
出行情况
2020/1/1
白天
天气晴朗,适合出行
夜晚
天气晴朗,适合出行
2020/1/2
白天
有小雨,出门请带伞
夜晚
有小雨,出门请带伞
表单
表单标签
form标签: 表单的最外层容器
input标签: 用于搜集用户信息,根据不同的type属性值,展示不同的控件
type属性
含义
text
普通的文本输入框
password
密码输入框
checkbox
复选框
radio
单选框
file
上传文件
submit
提交按钮
reset
重置按钮
代码
输入框:
密码框:
复选框:
苹果
香蕉
葡萄
单选框:
男
女
上传文件:
提交按钮:
重置按钮:
输出:
输入框:
密码框:
复选框:
苹果
香蕉
葡萄
单选框:
男
女
上传文件:
提交按钮:
重置按钮:
表单属性
action 提交的位置
action属性 点击提交按钮后,数据的提交位置
checked 设置默认值
代码
复选框:
苹果
香蕉
葡萄
单选框:
男
女
输出:
复选框:
苹果
香蕉
葡萄
单选框:
男
女
disabled 禁止选择某一项
代码:
复选框:
苹果
香蕉
葡萄
单选框:
男
女
输出:
复选框:
苹果
香蕉
葡萄
单选框:
男
女
placeholder在数据框中添加提示信息
代码:
用户名:
密码框:
输出:
用户名:
密码框:
表单相关标签
textarea 多行文本框
textarea属性
描述
cols
列
rows
行
代码:
输出
select下拉菜单
默认选择第一行,selected属性设置默认值
代码:
下拉菜单
北京
上海
广州
输出:
下拉菜单
北京
上海
广州
通过selected 和disabled实现提示信息,且不可选择
代码:
下拉菜单
请选择
北京
上海
广州
输出
下拉菜单
请选择
北京
上海
广州
size属性设置下拉菜单展示的行数,默认为1
代码:
下拉菜单
北京
上海
广州
输出
下拉菜单
北京
上海
广州
multiple多选属性
代码:
下拉菜单
北京
上海
广州
输出:
下拉菜单
北京
上海
广州
multiple属性还支持在上传文件中使用
代码
输出
label辅助表单
通过label标签可以实现单选框或复选框中,符号和文字是一个整体
代码:
单选框:
男
女
复选框:
苹果
香蕉
葡萄
输出:
单选框:
男
女
复选框:
苹果
香蕉
葡萄
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
