默認的無序列表的符號樣式都是一個小的黑色實心圓點。通過list-style-type 可以改變樣式的形狀，比如圓圈，方塊和其他自定義的圖片
但是有些時候，為了突出，我們需要將黑色圓點，變化成為其他顏色，比如紅色、黃色等
一、簡單寫一個無序列表
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style type="text/css">
</style>
</head>
<body>
<div>
<ul>
<li><p>我的顏色是紅色</p></li>
<li><p>我的顏色是紅色</p></li>
<li><p>我的顏色是紅色</p></li>
</ul>
</div>
</body>
</html>
二、設置其css樣式，將ul列表的樣式設置成為紅色
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style type="text/css">
ul{
color: red;
}
</style>
</head>
<body>
<div>
<ul>
<li><p>我的顏色是紅色</p></li>
<li><p>我的顏色是紅色</p></li>
<li><p>我的顏色是紅色</p></li>
</ul>
</div>
</body>
</html>
可以發現，列表的小黑點雖然變成了我們需要的紅色，但是文字也隨之變成了紅色，因為css樣式是疊加的樣式，此時，我們只需要將文字的顏色，設置成原來的黑色，即可達成效果。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style type="text/css">
ul{
color: red;
}
p{
color:black;
}
</style>
</head>
<body>
<div>
<ul>
<li><p>我的顏色是紅色</p></li>
<li><p>我的顏色是紅色</p></li>
<li><p>我的顏色是紅色</p></li>
</ul>
</div>
</body>
</html>
如圖，這就實現了小紅圓點，黑色文字。