发表于： 2016-03-23 21:42:11
1 955
今天完成的事情：win10上设置好了nginx
明天计划的事情：虽然画出了九宫格但感觉用的是最笨的方法，明天想想有没有更简洁的方法实现
遇到的问题：开始没有思路，参考了之前日报的内容；一开始css后缀名导致了一些问题；nginx试了几次才安装好
收获：虽然之前也尝试学习html和css但没有什么思路，跟着it修真院完成任务，学习到了前段工程师的工作思路，非常有启发。
--------------html----------------
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>九宫格</title>
<link rel="stylesheet" type="text/css" href="nine.css"/>
</head>
<body>
<div id="nine">
<div id="a"></div>
<div id="b"></div>
<div id="c"></div>
<div id="d"></div>
<div id="e"></div>
<div id="f"></div>
<div id="g"></div>
<div id="h"></div>
<div id="i"></div>
</div>
</body>
</html>
--------------css------------------
div#nine{
border-radius: 24px;
background-color: #89abcd;
width: 600px;
height: 600px;
}
div#a{
background-color: orange;
border-radius: 24px;
height:152px;
width: 152px;
margin: 24px;
float: left;
}
div#b{
background-color: orange;
border-radius: 24px;
height:152px;
width: 152px;
margin: 24px;
float: left;
}
div#c{
background-color: orange;
border-radius: 24px;
height:152px;
width: 152px;
margin: 24px;
float: left;
}
div#d{
background-color: orange;
border-radius: 24px;
height:152px;
width: 152px;
margin: 24px;
float: left;
}
div#e{
background-color: orange;
border-radius: 24px;
height:152px;
width: 152px;
margin: 24px;
float: left;
}
div#f{
background-color: orange;
border-radius: 24px;
height:152px;
width: 152px;
margin: 24px;
float: left;
}
div#g{
background-color: orange;
border-radius: 24px;
height:152px;
width: 152px;
margin: 24px;
float: left;
}
div#h{
background-color: orange;
border-radius: 24px;
height:152px;
width: 152px;
margin: 24px;
float: left;
}
div#i{
background-color: orange;
border-radius: 24px;
height:152px;
width: 152px;
margin: 24px;
float: left;
}
返回列表
评论