html - 7.列表标签

最新推荐文章于 2024-08-17 14:58:02 发布

旧林墨烟

最新推荐文章于 2024-08-17 14:58:02 发布

阅读量97

点赞数 1

分类专栏： html 文章标签： html

本文链接：https://blog.csdn.net/weixin_52115456/article/details/119924018

版权

html 专栏收录该内容

9 篇文章 0 订阅

订阅专栏

列表

有序列表

有序列表(order list)

列表格式：

<ol>
    <li>内容</li>
    <li>内容</li>
    <li>内容</li>
    <li>内容</li>
    <li>内容</li>
</ol>

无序列表

无序列表(unordered list)

列表格式:

<ul>
    <li>内容</li>
    <li>内容</li>
    <li>内容</li>
    <li>内容</li>
    <li>内容</li>
</ul>

自定义列表

列表格式：

<dl>
    <dt>列表名</dt>
    <dd>内容</dd>
    <dd>内容</dd>
    <dd>内容</dd>
    <dd>内容</dd>
    <dt>列表名</dt>
    <dd>内容</dd>
    <dd>内容</dd>
    <dd>内容</dd>
    <dd>内容</dd>
</dl>

示例代码

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>列表学习</title>
</head>
<body>

<!-- 有序列表 -->
<ol>
    <li>Java</li>
    <li>Python</li>
    <li>PHP</li>
    <li>JavaScript</li>
    <li>c/c++</li>
</ol>

<!--  无序列表  -->
<ul>
    <li>Java</li>
    <li>Python</li>
    <li>PHP</li>
    <li>JavaScript</li>
    <li>c/c++</li>
</ul>

<!--  自定义列表  -->
<dl>
    <dt>学科</dt>
    <dd>Java</dd>
    <dd>Python</dd>
    <dd>C++</dd>
    <dd>PHP</dd>
    <dt>水果</dt>
    <dd>葡萄</dd>
    <dd>苹果</dd>
    <dd>凤梨</dd>
    <dd>芒果</dd>
</dl>
</body>
</html>

视图

$[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-5ZvnQXbA-1629940532671)(C:\Users\wuguanghui\AppData\Roaming\Typora\typora-user-images\image-20210826091450703.png)]$

旧林墨烟

关注

1
点赞
踩
1

收藏

觉得还不错? 一键收藏
打赏
0
评论
html - 7.列表标签

列表有序列表有序列表(order list)列表格式：<ol> <li>内容</li> <li>内容</li> <li>内容</li> <li>内容</li> <li>内容</li></ol>运用：试卷、问答…无序列表无序列表(unordered list)列表格式:<ul> &lt
复制链接

扫一扫