<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
.box1{
background-color: #cccccc;
padding: 30px 15px;
width: 240px;
height: 360px;
box-sizing: border-box;/*新盒膜类型*/
color:white;
margin: 0 auto;/**/
}
.box2{
width:210px;
height: 60px;
padding: 15px;
box-sizing:border-box;
font-size: 20px;
}
span{
float: right;/*行内元素的本质是文本但块内元素的本质不是文本 */
}
</style>
</head>
<body>
<div class="box1" align="conter">
<div class="box2"><img src="img/1.png" alt="" >菜谱大全<span> > </span></div>
<div class="box2"><img src="img/2.png" alt="" >食材大全<span> > </span></div>
<div class="box2"><img src="img/3.png" alt="" >品质珍选<span> > </span></div>
<div class="box2"><img src="img/4.png" alt="" >专题专区<span> > </span></div>
<div class="box2"><img src="img/5.png" alt="" >一起红<span> > </span></div>
</div>
</body>
</html>
G o o g l e
3640
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
