表格
table标签用于定义表格
tr 必须嵌套在table标签中
td 必须嵌套在tr中
表格的基本语法:
↑---border代表边框线
align代表位置 right左边left(右边)center(中间)
cellspacing规定单元格与单元格之间的空白 默认值为2像素
cellpadding规定单元格与内容之间的空白 默认值为1像素
width 规定表格的宽度
案例一:
案例一排名 | 关键词 | 趋势 | 今日搜索 | 最近七日 | 相关链接 |
---|---|---|---|---|---|
1 | 鬼吹灯 | 456 | 123 | ||
1 | 鬼吹灯 | 456 | 123 | ||
3 | 鬼吹灯 | 456 | 123 | ||
1 | 鬼吹灯 | 456 | 123 | ||
1 | 鬼吹灯 | 456 | 123 | ||
1 | 鬼吹灯 | 456 | 123 |
合并单元格:
步骤:1.先确定跨行合并还是跨列合并
2.找到要合并的目标单元格,写上合并方式=合并数量
3.删除多余的单元格
rowspan 跨行合并
colspan 跨列合并
案例二:
合并序号 | 王五 | 李四 | 孙传 | 胡平 | 合计 | ||||
---|---|---|---|---|---|---|---|---|---|
语文 | 数学 | 语文 | 数学 | 语文 | 数学 | 语文 | 数学 | ||
1 | 78 | 96 | 67 | 98 | 88 | 75 | 94 | 69 | |
2 | 89 | 68 | 77 | 87 | 84 | 76 | 71 | 87 | |
3 | 75 | 78 | 89 | 74 | 65 | 68 | 98 | 90 | |
4 | 79 | 89 | 65 | 62 | 64 | 87 | 97 | 91 |
列表:
表格显示数据,列表布局
列表分为有序列表、无序列表、自定义列表=
无序列表:项目符号列表项
1.无序列表中的列表项是并列的,无序列表没有顺序之分
2.ul中只能嵌套li
是不允许的
3.li双边标记 容器 li可以容纳所有元素
4.无序列表有自己的样式属性,实际开发中,使用css设置的
语法格式:
- 列表项
- 列表项
- 列表项
有序列表:排列顺序的
1.ol标签定义有序列表。
2.列表的排序默认数字显示
3.使用li列表项
4.无序列表有自己的样式属性,实际开发中,使用css设置的
语法格式:
- 列表项
- 列表项
- 列表项
※自定义列表(重点)
没有任何项目符号
1.dl标签描述定义列表 dt和dd一起使用
2.dl标签中只能包含dt和dd
3.dt和dd的个数没有限制的 经常一个dt对应多个dd
语法格式:
-
名词
- 名词解释1
- 名词解释2
- 名词解释3
列表总结:
ul:无序列表 只能包含li 没有顺序 使用较多 li里面包含任何标签
ol:有序列表 只能包含li 有顺序 基本不用 li里面包含任何标签
dl:自定义列表 只能包含dt和dd dt和dd里面可以存放任意标签的
表单
目的是为了收集用户的信息
网页中完整的表单分为表单域、表单控件(表单的元素)、提示信息
表单域:一个包含表单元素的区域
HTML中,form标签定义表单域,实现用户信息的收集和传递
form表单元素的信息提交给服务器
单控件:定义各种表单元素,表单元素就是允许用户在表单中输入或者选择的空间
1.input 输入表单元素
type属性:根据不同的type属性值,文本输入框、密码、单选、多选、按钮
name属性:当前的input表单的名称
checked属性:表示默认选中的状态。用于单选和多选
lable标签:用于绑定一个表单元素,提升用户体验
2.select 下拉表单元素
option 定义selected=“selected” 当前想默认选中
3.textarea 文本域元素
结构:
单行文本输入框
密码框
单选框单选
复选框复选框