標籤--無序列表

時間 2019-12-11

標籤標籤無序列表简体版

原文原文鏈接

[2019.07.02 學習筆記2]html

1.定義無序列表,沒有順序。ide

2.默認狀況下采用粗體圓點進行標記，無序列表始於<ul>標籤，每一個列表項始於<li>。學習

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>無序列表 </title>
</head>
<body>
    <ul>
        <li> <a href="http://www.baidu.com/">百度連接1</a></li>
        <li><a href="http://www.baidu.com/">百度連接2</a></li>
        <li><a href="http://www.baidu.com/">百度連接3</a></li>
    </ul>
</body>
</html>

3.改變項目符號，在<ul>標籤上加上type屬性spa

type="disc" 默認黑色圓點3d

　type="circle" 空心圓點code

type="square" 方塊htm

 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>無序列表 </title>
 6 </head>
 7 <body>
 8     <!--默認-->
 9     <ul>
10         <h4>默認項目符號</h4>
11         <li> <a href="http://www.baidu.com/">百度連接1</a></li>
12         <li><a href="http://www.baidu.com/">百度連接2</a></li>
13         <li><a href="http://www.baidu.com/">百度連接3</a></li>
14     </ul>
15     <!-- disc：粗體圓點-->
16     <ul type="disc">
17         <h4>disc：粗體圓點</h4>
18         <li> <a href="http://www.baidu.com/">百度連接1</a></li>
19         <li><a href="http://www.baidu.com/">百度連接2</a></li>
20         <li><a href="http://www.baidu.com/">百度連接3</a></li>
21     </ul>
22     <!--circle：空心圓點-->
23     <ul type="circle">
24         <h4>circle：空心圓點</h4>
25         <li> <a href="http://www.baidu.com/">百度連接1</a></li>
26         <li><a href="http://www.baidu.com/">百度連接2</a></li>
27         <li><a href="http://www.baidu.com/">百度連接3</a></li>
28     </ul>
29     <!--square:方塊-->
30     <ul type="square">
31         <h4>square:方塊</h4>
32         <li> <a href="http://www.baidu.com/">百度連接1</a></li>
33         <li><a href="http://www.baidu.com/">百度連接2</a></li>
34         <li><a href="http://www.baidu.com/">百度連接3</a></li>
35     </ul>
36 </body>
37 </html>

無序列表--type屬性

4.可繼續嵌套<ul>標籤blog

 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>無序列表 </title>
 6 </head>
 7 <body>
 8     <ul>
 9         <li>有害垃圾</li>
10         <li>可回收物</li>
11         <li>溼垃圾</li>
12         <li>幹垃圾
13             <ul>
14                 <li>餐盒</li>
15                 <li>餐巾紙</li>
16                 <li>溼紙巾</li>
17                 <li>硬果殼
18                     <ul>
19                         <li>椰子殼</li>
20                         <li>榴蓮殼</li>
21                         <li>核桃殼</li>
22                     </ul>
23                 </li>
24             </ul>
25         </li>
26     </ul>
27 </body>
28 </html>

無序列表--嵌套

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。