HTML学习笔记12-HTML列表

最新推荐文章于 2022-01-20 12:26:47 发布

weeds606

最新推荐文章于 2022-01-20 12:26:47 发布

阅读量254

点赞数

本文链接：https://blog.csdn.net/doulihang/article/details/98937675

版权

前端相关专栏收录该内容

42 篇文章 0 订阅

订阅专栏

一、HTML无序列表

1.HTML无序列表使用<ul>标签进行定义，列表项使用<li>标签进行定义。列表项内部可以使用段落、换行符、链接、其他列表。具体代码如下

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>列表练习</title>
</head>
<body>
<ul>
    <li>列表1</li>
    <li>列表2</li>
    <li>列表3</li>
</ul>
</body>
</html>

页面显示如下：

2.快速添加ul及li标签

需求场景：添加ul下包含十个li标签。在工具中输入ul>li*10按tab健即可

二、HTML有序列表

HTML有序列表使用<ol>标签定义，列表项使用<li>标签定义。具体代码如下

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>有序列表练习</title>
</head>
<body>
<ol>
    <li>列表A</li>
    <li>列表B</li>
</ol>
</body>
</html>

页面显示如下：

三、HTML自定义列表

自定义列表列表使用<dl>标签定义，自定义列表项使用<dt>或<dd>标签定义。具体实现代码如下：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>自定义列表项</title>
</head>
<body>
<dl>
    <dd>dd标签列表项</dd>
    <dt>dt标签列表项</dt>
</dl>
</body>
</html>

页面显示如下：

weeds606

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
HTML学习笔记12-HTML列表

一、HTML无序列表1.HTML无序列表使用<ul>标签进行定义，列表项使用<li>标签进行定义。列表项内部可以使用段落、换行符、链接、其他列表。具体代码如下<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title...
复制链接

扫一扫