css部分
*{通配符选择器 设置所有填充0边距0
padding:0px;
margin:0px;
}
#div-box1{id选择器 id为div-box1的块元素 宽度500 高度400 边框1像素 实线 银灰色 边距上40 右0 下0 左40像素
width:500px;
height:400px;
border:1px solid silver;
margin:40px 0 0 40px;
}
.faceul{类选择器 list-style-type 设置消除列表标记
list-style-type:none;
background:#F00;背景色
}
.faceul img{后代元素选择器 设置ul中的图片的宽度和边距
width:40px;
margin:5px 0px 0px 10px;
}
.faceul li{设置浮动
/*为了让li放到一排,使用了左浮动*/
float:left;
border:1px solid red;
width:60px;
height:70px;
margin-left:25px;
margin-top:25px;
}
.faceul span{
font-size:small;
margin-left:15px;
margin-top:5px;
display:block;
}
.faceul a:link{ 伪类选择器
color:black; 链接颜色
text-decoration:none; 不添加文本的修饰
}
.faceul a:hover{
color:red;
text-decoration:underline;
}
body部分
<div id = "div-box1">
<ul class = "faceul">
<li><img src=""/><span><a href = "#">明星</a></span>
</li>
</ul>
</div>