ul和li元素

鹤川

发布于 2023-03-21 21:40:04

1.4K0

发布于 2023-03-21 21:40:04

文章被收录于专栏：鹤川博客

ul和li元素

一、基本语法介绍

ul：无序列表
ol：有序列表
li：列表中项目，经常配合 ul 或 ol 一起使用

<ul>
	<li></li>
</ul>

<ol>
	<li></li>
</ol>

二、代码实战

新建 html 文件 07-ul.html ，编写下方程序，运行看看效果吧。

<!DOCTYPE html>
<htmllang="en">
    <head>
        <metacharset="UTF-8">
        <metahttp-equiv="X-UA-Compatible"content="IE=edge">
        <metaname="viewport"content="width=device-width, initial-scale=1.0">
        <title>ul和li</title>
    </head>
    <body>
       <ul>
            <listyle="list-style-type: none;">内容1</li>
            <listyle="list-style-type: circle;">内容2</li>
            <li>内容3</li>
            <li>内容4</li>
       </ul> 
       <ol>
            <listyle="list-style-type: none;">内容1</li>
            <li>内容2</li>
            <li>内容3</li>
            <li>内容4</li> 
       </ol>
    </body>
</html>

本文参与腾讯云自媒体同步曝光计划，分享自作者个人站点/博客。

原始发表：2023 年 02 月，如有侵权请联系 cloudcommunity@tencent.com 删除

html