list-style-type:none;
disc：实心圆
cirle：空心圆
none：不使用项目符号
decimal：阿拉伯数字
square：实心方块......
用于控制列表项显示符号的类型
一般设置为none，后面我们都是通过设置背景图片的方式添加图标
list-style-image:url();为各个列表项设置项目图标，使外观更好看
但是设置的列表项图标和列表项并没有对齐，所以实际工作中通常都是对<li>设置背景图片的方式来实现列表图标
```java
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style type="text/css">
ul{
list-style-image: url("images/tb.gif");
}
</style>
</head>
<body>
<ul>
<li>可是谁又真的关心谁</li>
<li>可是谁又真的关心谁</li>
<li>可是谁又真的关心谁</li>
</ul>
</body>
</html>
list-style-position：inside | outside;
控制列表项目符号的位置，即列表项目符号相对于列表项内容的位置
inside：列表项目符号位于列表文本以内
outside：列表项目符号位于列表文本以外(默认值)
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style type="text/css">
.one {
list-style-position: inside;
}
.two {
list-style-position: outside;
}
</style>
</head>
<body>
<ul class="one">
<li>可是谁又真的关心谁</li>
</ul>
<ul class="two">
<li>可是谁又真的关心谁</li>
</ul>
<ul class="three">
<li>可是谁又真的关心谁</li>
</ul>
</body>
</html>
列表样式的联写
list-style:url() inside square;
无顺序要求
一般只写list-style:none;然后为<li>标签设置一个背景图片即可
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style type="text/css">
*{
margin: 0;
padding: 0;
}
.one{
width: 200px;
height: 160px;
margin : 0 auto;
border:1px solid red;
padding-top: 20px;
}
ul{
list-style-position: inside;
}
ul li{
height: 20px;
line-height: 20px;
background: url("images/tb.gif") no-repeat left center;
list-style: none;
padding-left: 14px;
}
</style>
</head>
<body>
<div class="one">
<ul>
<li>可是谁又真的关心谁</li>
<li>有人问我是与非</li>
<li>怎么能有牵挂</li>
</ul>
</div>
</body>
</html>
