网页的表格和列表
2023-03-20 14:41:14 时间
网页中表格和列表随处可见,所以我们需要掌握各个标签的用法以及区别。
表格
简单的HTML表格由table元素以及多个tr th或td元素组成。这几个都是双标签。
tr定义行 th定义表头 td定义表格单元
两行两列的表格,常见代码:(运行结果自己查看)
<table>
<tr>
<th>序号</th>
<th>姓名</th>
</tr>
<tr>
<td>1</td>
<td>张三</td>
</tr>
</table>
复杂的表格可能包含thead、tbody、tfoot比较常见,caption、col、colgroup不常见。
具体用法示例:(运行结果自己查看)
<table>
<thead>
<tr>
<th>标题头</th>
<th>标题头</th>
</tr>
</thead>
<tbody>
<tr>
<td>单元内容</td>
<td>单元内容</td>
</tr>
</tbody>
<tfoot>
<tr>
<td>表格尾</td>
<td>表格尾</td>
</tr>
</tfoot>
</table>
列表
HTML支持有序、无序和定义列表。具体解释如下:
1、有序列表:列表项目使用数字进行标记。有序列表始于<ol>标签,每个列始于<li>标签。
示例:(运行结果自己查看)
<ol>
<li>我</li>
<li>喜</li>
<li>欢</li>
<li>你</li>
</ol>
2、无序列表:每一列使用原点或圆圈进行标记。无序列表始于<ul>标签,每个列始于<li>标签。
示例代码:(运行结果自己查看)
<ul>
<li>Coffee</li>
<li>Milk</li>
</ul>
2、自定义列表:每一列使用原点或圆圈进行标记。无序列表始于<dl>标签,每个列始于<dt>或者<dd>标签。dt内容块的标题,dd 内容。
示例代码:(运行结果自己查看)
<dl>
<dt>标题</dt>
<dd>内容1</dd>
<dd>内容2</dd>
</dl>
相关文章
- 程序员你是怎么绘制架构图?
- 继微软、甲骨文等美国企业后 日本软银也要加入瓜分TikTok之列
- 命令式和声明式代码有什么区别
- 使用命令行工具 Graudit 来查找你代码中的安全漏洞
- 高科技公司的 CEO 要写代码吗?
- 这个GitHub 1.4k星的Git魔法书火了丨有中文版
- 手机没网了,却还能支付,这是什么原理?
- 官媒聚焦“码农”35岁天花板现象,人到中年告别游戏业?
- 前端必会:CDN加速原理
- 还以为 VSCode 是程序员专属的工具?那你可太小看它了
- 【网页特效】11 个文本输入和 6 个按钮操作 特效库
- 所有的编程语言知识,都包含在这100张思维导图里了丨开源
- 5种可能在10年后消失的开发语言
- 烂大街的“中台”,终将“一地鸡毛” ?
- 图解|什么是RSA算法
- 2020年网络开发人员必读书单:让你的代码和架构更上一层楼
- 谷歌软件工程师是怎样写设计文档的?
- 线上 Go 程序偶尔出现异常怎么办?这个思路可解决你的烦恼
- 美国限制半导体设备出口:制造设备及相关软件工具、激光器、传感器...
- 初学者指南:什么是算法?11行伪代码给你讲明白