<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>基本选择器实例</title>
<style type="text/css">
/*元素选择器 */
ul{
padding:0;
margin:0;
width:450px;
border:1px dashed #666;
padding:10px 5px;
}
ul:after{
content:'';
display:block;
clear:both;
}
li{
list-style:none;
float:left;
width:40px;
line-height:40px;
text-align:center;
border-radius:50%;
background-color:skyblue;
margin-right:5px;
}
#user1{
background-color: green;
}
.age{
background-color: red;
}
</style>
</head>
<body>
<ul>
<li id="user1">lgw</li>
<li>32</li>
<li id="user2">wjf</li>
<li>33</li>
<li>yly</li>
<li>35</li>
<li>wyc</li>
<li>54</li>
<li>lll</li>
<li>55</li>
</ul>
</body>
</html>
