发表于: 2016-10-05 17:30:41
2 725
今天完成的事情:完成task1
明天计划的事情:进军task2,速度要加快了
收获:加深了对display 盒模型 的理解
代码如下:
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width, intial-scale=1.0, minimum-scale=0.5, maximum-scale=2.0, user-scalable=yes" />
<style type="text/css">
.box{background:#FF6600;
width:200px;
height:200px;
margin:10px;
display:table-cell;
float:left;
border-radius:20px;
}
.row{
display:table-row;
}
#main{
width:660px;
height:660px;
display:table;
text-align:center;
margin:0 auto
}
</style>
<title>task1 九宫格</title>
</head>
<body>
<div id="main">
<div class="row">
<span class="box"></span>
<span class="box"></span>
<span class="box"></span>
</div>
<div class="row">
<span class="box"></span>
<span class="box"></span>
<span class="box"></span>
</div>
<div class="row">
<span class="box"></span>
<span class="box"></span>
<span class="box"></span>
</div>
</div>
</body>
</html>
评论