CSS如何设置列表样式属性(看这篇文章就够用了)

2020-05-16 06:59:51易采站长站整理
属性)的一个简写属性,它集成了(
list-style-type
属性、
list-style-position
属性、
list-style-image
属性)的功能。

让我们进入

list-style
属性实践,既然看到了这里想必园友都已经掌握了本章的内容了。

代码块


<!DOCTYPE html>
<html lang="en">

<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>使用list-style属性方式</title>
<style>
ul {
width: 300px;
height: 150px;
border: 1px solid #00F;
}
ul li {

width: 290px;
height: 30px;
line-height: 30px;
border: 1px solid red;
list-style: none inside url(./img/001.png) ;
}

</style>
</head>

<body>
<ul>
<li>成功不是打败别人,而是改变自己。</li>
<li>成功不是打败别人,而是改变自己。</li>
<li>成功不是打败别人,而是改变自己。</li>
</ul>

</body>
</html>

结果图

注意:

list-style
属性值可以也
1
个或
2
3
个,顺序没有要求,若有不明白的园友可以做个实例看看就明白了,学习就要多尝试不要偷懒呦。