列表
有序列表 – ol、li
无序列表：ul、li
定义列表：dl、dt、dd
列表相关的CSS属性
03_列表_列表的属性使用.html
<!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>Document</title>
<style>
ul {
/* 1.list-style-type: none; */
/* 2.list-style-image */
/* margin-left: 200px;
list-style-image: url(../img/test_01.webp); */
/* 3.list-style-position */
/* list-style-position: inside; */
/* 4.list-style: 缩写属性 */
/* list-style: type image position; */
list-style: none;
padding: 0;
margin: 0;
}
ul li {
margin-top: 8px;
}
ul li span {
background-color: #f00;
color: #fff;
padding: 0 5px;
}
</style>
</head>
<body>
<h2>热门电影</h2>
<ul>
<li>
<span>1</span>
海王
</li>
<li>
<span>2</span>
海贼王
</li>
<li>
<span>3</span>
药王
</li>
<li>
<span>4</span>
上海堡垒
</li>
<li>
<span>5</span>
诛仙
</li>
</ul>
</body>
</html>