HTML的学习笔记3
![](https://upload-bbs.miyoushe.com/upload/2023/07/27/202672061/5d134dd7ca3f2bb5a865547c10ea0a57_7487414803788967137.png)
AI-摘要
Tianli GPT
AI初始化中...
介绍自己 🙈
生成本文简介 👋
推荐相关文章 📖
前往主页 🏠
前往爱发电购买
HTML的学习笔记3
前尘小筑列表标签
列表标签的应用场景:在网页中按照行展示关联的内容
特点:按照行的方式,整齐显示内容
种类:有序列表,无序列表,自定义列表
无序列表
标签是由ul标签名和li标签名组成的。
ul标签是无序列表的整体用于包裹标签,li标签表示无序列表的每一项,用于包含内容。
注意:
- ul只能包含li标签
- li标签能包含任意内容
举例1
2
3
4
5<ul>
<li>榴莲</li>
<li>香蕉</li>
<li>苹果</li>
</ul>
有序标签
标签是由ol标签和li标签名组成,其余的规则与无序标签是相同的。
举例
1 | </ul> |
自定义列表
标签是由dl标签名,dt标签名,dd标签名组成。
dl标签名:表示自定义列表的整体,用于包裹dt/dd标签。
dt标签名:表示自定义列表的主题。
dd标签名:表示自定义列表的针对主题的每一项内容。
显示特点:
- dd前会默认显示缩进效果
注意: - dl标签中只允许包含dt/dd标签
- dt/dd标签可以包含任意内容
举例:1
2
3
4<dl>
<dt>帮助中心</dt>
<dd>用户指南</dd>
</dl>表格
表格标签的基本属性
表格的应用场景:在网页中以行+列的单元格的方式整齐的展示数据,如:学生的成绩等
基本的标签属性:标签名称 说明 table 表格整体,可以用于包裹多个tr tr 表格每行,用于包裹td td 表格单元格,可用于包裹内容 注意点:
- 标签的嵌套关系:table > tr >td
代码举例1
2
3
4
5
6
7
8
9
10
11
12
13
14<body>
<table>
<tr>
<td>姓名</td>
<td>成绩</td>
<td>评语</td>
</tr>
<tr>
<td>墨尘</td>
<td>100分</td>
<td>加油干</td>
</tr>
</table>
</body>
表格的相关属性
应用在设置表格的基本展示效果
常见的相关属性:属性名 属性值 效果 border 数字 边框宽度 width 数字 边框高度 height 数字 边度高度 注意点:
- 相关属性名应写在table标签内
- 在实际开发针对于样式效果推荐使用css进行设置
- 标签的嵌套关系:table > tr >td
评论
匿名评论隐私政策
✅ 你无需删除空行,直接评论以获取最佳展示效果