<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>列表</title>
<style>
ol{
border: 1px solid ;
}
/*包含选择器 空格*/
ol li{
border: 1px solid;
}
ul{
background-color: yellow;
}
ul li{
border: 1px red dashed;
}
</style>
</head>
<body>
<!--有序的列表order list ol标签只可以放li标签-->
<ol>
<li>aaa</li>
<li>bbb</li>
<li>ccc</li>
<li>ddd</li>
</ol>
<!--无序的列表unorder list ul标签只可以放li标签-->
<ul>
<li>111</li>
<li>222</li>
<li>333</li>
<li>444</li>
<li>555</li>
</ul>
</body>
</html>
有序列表和无序列表效果: