#WEB安全基础 : HTML/CSS | 0x4.1嵌套列表

作者: 90后单身自救联合会创始人兼会长
来源: 51数据库
2021-08-27

如果你认为列表只有ul和ol那你就错了

我要为你展示新的列表

这次只有一个index.html文件

^{这是它的效果}

以下是它的代码

 1 <html>
 2 <head>
 3 <title>test</title>
 4 </head>
 5 <body>
 6 <!--嵌套列表-->
 7 <p>
 8 嵌套列表
 9 </p>
10 <ol>
11 <!--在<ol>以内并且在<ul>以外的<li>属于有序列表-->
12 <li>charge segway</li>
13 <li>pack for trip</li>
14 <!--在<ul>以内的是无序列表-->
15 <ul>
16 <li>cell phone</li>
17 <li>ipod</li>
18 </ul>
19 </ol>
20 <br>
21 <br>
22 <p>
23 定义列表
24 </p>
25 <dl>    <!--定义列表-->
26 <dt>burma shave signs</dt>    <!--无缩进-->
27 <dd>road signs common in the u.s. in the 1920s and 1930s advertising shaving produces.</dd>
28 <dt>route 66</dt>
29 <dd>most famous road in the u.s.highway system.</dd>    <!--有缩进-->
30 </dl>
31 </body>
32 </html>

无序列表里能插入有序列表，有序列表里能插入无序列表

定义列表被dl元素括起来

现在，你可以使用有缩进的整洁的列表了

//本系列教程基于《head first html与css(第二版)》,此书国内各大购物网站皆可购买

转载请注明出处 by:m_zphr

最后修改日期：2019-01-17

推荐阅读