HTML(5)——列表表格

列表

无序列表

作用:布局排列整齐的不需要规定顺序的区域。

标签:ul嵌套il,ul是无序列表,li是列表条目

注:ul标签只能包裹li标签,li标签可以包含任何内容

有序列表

作用:布局排列整齐的需要规定顺序的区域。

标签:ol嵌套li,ol是有序列表。

注:ol标签只能包裹li标签,li标签里面可以包裹任何内容

定义列表

标签:dl嵌套dt和dd,dl是定义列表,dt是定义列表的标题,dd是定义列表的描述/详情

<dl>

<dt>列表标题</dt>

<dd>列表描述</dd>

......

</dl>

注:dl里面只能包含dt和dd,dt和dd可以包含任何内容。

表格

标签:table嵌套tr,tr嵌套td、th。

标签名 说明
table 表格
tr
th 表头单元格
td 内容单元格

在网页中,表格默认没有边框线,使用border属性可以为表格添加边框线

表格结构标签

作用:用表格结构标签把内容划分区域,让表格结构更清晰。

标签名 含义 说明
thead 表格头部 表格头部内容
tbody 表格主体 主要内容区域
tfoot 表格底部 汇总信息区域

合并单元格

作用:将多个单元格合并成一个单元格,以合并同类信息。

合并单元格步骤:

1.明确合并的目标

2.跨行合并,保留最上单元格,添加属性rowspan

跨列合并,保留最左单元格,添加属性colspan

3.删除其他单元格

相关推荐
yqcoder几秒前
11. HTML 中 DOCTYPE 的作用
前端·html
小六花s13 分钟前
web登录页面
前端·javascript·css
斯普信专业组8 小时前
2025 最好的Coze入门到精通教程(下)
前端·javascript·ui
德育处主任9 小时前
p5.js 圆弧的用法
前端·javascript·canvas
Arvin62710 小时前
Nginx IP授权页面实现步骤
服务器·前端·nginx
xw511 小时前
Trae安装指定版本的插件
前端·trae
默默地离开11 小时前
前端开发中的 Mock 实践与接口联调技巧
前端·后端·设计模式
南岸月明11 小时前
做副业,稳住心态,不靠鸡汤!我的实操经验之路
前端
嘗_11 小时前
暑期前端训练day7——有关vue-diff算法的思考
前端·vue.js·算法
MediaTea12 小时前
Python 库手册:html.parser HTML 解析模块
开发语言·前端·python·html