开启掘金成长之旅！这是我参与「掘金日新计划 · 12 月更文挑战」的第10天，点击查看活动详情
之前的文章提到过列表分为有序列表、无序列表和自定义列表。
无序列表的html标签写法：
<ul>
<li>内容1</li>
<li>内容2</li>
<li>内容3</li>
<li>内容4</li>
<li>内容5</li>
</ul>
展示在浏览器中的样式是每个
li内部的文本内容独占一行且前方带有一个实心圆圈的项目符号，这个项目符号默认情况下是黑色实心圆圈。
之前说过怎么用html标签对这个项目符号进行修改，现在介绍一下用css修改项目符号的方法。
修改列表前的项目符号
html中用
type属性修改无序列表的项目符号的方法：
属性值的含义和html中相同，在声明中修改属性信息为 list-style-type 就可以
css中修改无序列表项目符号的方法（有序列表无序列表均适用）： |属性|属性值|含义| |---|---|---| |list-style-type|disc|修改项目符号为实心圆圈| |list-style-type|circle|修改项目符号为空心圆圈| |list-style-type|square|修改项目符号为实心方块| |list-style-type|none|修改项目符号为空|
设置项目符号为一张图
除了修改符号样式外还可以自定义符号样式为一个图片，书写声明 list-style-image:url(); 即可。
设置项目符号的位置
| 属性 | 属性值 | 含义 |
|---|---|---|
| list-style-position | outside | 修改项目符号在列表外（默认值） |
| list-style-position | inside | 修改项目符号在列表内 |
如图所示，
第一行文字中项目符号部分是一个实心圆圈，list部分是“我是一朵雪花”；
第二行文字中项目符号部分是空出来的，list部分是一个实心圆圈和“我是第二朵雪花”
以上就是list-style-position属性值命令项目符号在列表内外的区别，inside:有项目符号，项目符号和list同在list板块，项目符号板块为空
设置了图片为项目符号，项目符号展示不出完整图片时，添加声明
list-style-position: inside，就可以展示出完整的图片了。
声明的简便写法
上面介绍的三个属性可以写成 list-style ，属性值书写上方三个属性的属性值即可，属性值书写顺序没有限制；可以只书写需要修改的属性值。
