1.<ul></ul> 无序列表标签
<ul><li></li></ul> 组合标签,其他标签是不允许组合的
<li></li> 标签是一个容器,可任意容纳所有的元素
列表是自带样式属性的
常用type属性:disc 实心圆(默认)、circle 空心圆、square 小方块、none 不显示
语法示例:<ul type="circle">
<li>列表内容</li>
<li>列表内容</li>
</ul>
2.<ol></ol> 有序列表标签,与无序列表类似
常用type属性:1 表示列表项目用阿拉伯数字标号(1,2,3...)
a 表示列表项目用小写英文字母标号(a,b,c...)
A 表示列表项目用大写英文字母标号(A,B,C...)
i 表示列表项目用小写罗马数字标号(ⅰ,ⅱ,ⅲ...)
I 表示列表项目大写罗马数字标号(Ⅰ,Ⅱ,Ⅲ...)
语法结构同无序列表
3.<dl></dl> 自定义列表标签,自定义列表默认为两个层次,第一层为列表项标签(<dt></dt>),第二层为注释项标签(<dd></dd>),一般用于对术语或名词的解释和描述
语法示例:<dl>
<dt> 列表项目1</dt>
<dd>项目1注释</dd>
<dt>列表项目2</dt>
<dd>项目2注释</dd>
</dl>
4.表格常用标签
<table></table> 定义表格
<caption></caption> 定义表格标题
<tr></tr> 定义表行,只能包含<td>或<th>标签
<td></td> 定义单元格
<th></th> 定义表格页眉单元格
<thead></thead> 定义表格头
<tbody></tbody> 定义表格体
<tfoot></tfoot> 定义表格脚
5.表格语法示例
<table align="center" border="2" cellspacing="0" cellpadding="10" width="500px" height="30px" …………> <caption>商品出库表</caption> <thead> <tr> <th>产品名称</th> <th>业务日期</th> <th>出库数量</th> </tr> </thead> <tbody> <tr> <td>纯牛奶</td> <td>2020年2月2日</td> <td>22箱</td> </tr> </tbody> <tfoot> <tr> <td colspan="3">系统数据更新中。。。</td> </tr> </tfoot> </table>
6.表格常用属性
width,表格宽度
height,表格高度
align,表格在页面中的水平位置
background,表格背景图片
bgcolor,表格背景颜色
border,表格边框宽度(px),默认没有边框
bordercolor,表格边框颜色(当border>=1时有效)
cellspacing,表格单元格之间的间距
cellpadding,单元格内容与单元格边框之间空白的距离
7.表格行常用属性
height,行高
align,行内容水平对齐方式,参数值“left,center,right”
valign,行内容垂直对齐方式,参数值“top,middle,bottom”
bgcolor,行背景颜色
8.表格列常用属性
width/height,单元格宽度/高度
align,列内容水平对齐方式
valign,列内容垂直对齐方式
bgcolor,列背景颜色
colspan,设置列单元格合并
rowspan,设置行单元格合并
9.单元格合并示例
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>创建表格测试</title> </head> <body> <table border="2px" width="600px" height="600px" align="center" cellspacing="0"> <caption>测试表</caption> <tr> <td colspan="2"></td> <td rowspan="2"></td> </tr> <tr> <td rowspan="2"></td> <td></td> </tr> <tr> <td colspan="2"></td> </tr> </table> </body> </html>