发表于: 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>



返回列表 返回列表
评论

    分享到