Html 列表 li ul使用

虾米哥阅读：830 2020-10-18 22:04:22 评论：0

html中偶尔会使用到列表，记录一下。

 1 <!DOCTYPE html> 
 2 <html> 
 3     <head> 
 4         <meta charset="UTF-8" /> 
 5         <style type="text/css"> 
 6             .level_1{list-style-type:decimal;} 
 7             .level_2{list-style-type:upper-alpha;} 
 8         </style> 
 9     </head> 
10  
11     <body> 
12         <span>列表使用test:</span> 
13         <ul class = "level_1"> 
14             <li> 
15                 亚洲 
16                 <ul class = "level_2"> 
17                     <li>中国</li> 
18                     <li>日本</li> 
19                 </ul> 
20             </li> 
21             <li> 
22                 欧洲 
23                 <ul class = "level_2"> 
24                     <li>德国</li> 
25                     <li>意大利</li> 
26                 </ul> 
27             </li> 
28         </ul> 
29     </body> 
30 </html>

1. 序号可以是数字、字母、罗马数字等，可以通过list-style-type 属性设置。

默认值: disc 点| circle圆圈 | square正方形 | decimal数字 | decimal-leading-zero 十进制数 
| lower-roman 小写罗马文字| upper-roman 大写罗马文字|  armenian亚美尼亚数字 | georgian乔治亚数字  
| lower-alpha小写拉丁文 | upper-alpha大写拉丁文 | none无  
| inherit继承  
初始值: disc

2. 序号也可以显示图片，可以通过list-style-image 属性设置

 list-style-image:none/url("1.png")

标签:CSS 前端 HTML5

声明

1.本站遵循行业规范，任何转载的稿件都会明确标注作者和来源；2.本站的原创文章，请转载时务必注明文章作者和来源，不尊重原创的行为我们将追究责任；3.作者投稿可能会经我们编辑修改或补充。