发表于： 2017-03-08 23:21:35
4 667
今天完成的事情：了解了很多关于CSS框模型的知识，一开始也是很多不懂，看了很多师兄们的日报，明白了margin和float等相关逻辑，也总算初步把九宫格给写出来了。
明天计划的事情：把剩下的任务1完成了，顺便开始任务2。
收货：一开始看师兄们的代码真是一头雾水，但后来理清了class类选择器等方面，发现就是类似于“描述”与“填充”，一下就理清关系了，而且看了吴江峰师兄的日报后，发现对于百分比margin使用起来太舒服了！下面贴上我的代码，争取这7天都能学好基础，写好日报，早日去线下！
<!DOCTYPE html>
<html lang="en">
<head>
<meta name="viewport" width="divce-width"
height="divce-height" initial-scal="1" maximum-scale="1.0 " minmum-scale="1.0" user-scalable="no">
<title>九宫格</title>
<style>
body {
font-size: 62.5%;
width: 50em;;
height: 50em;;
margin:0 auto;
background-color:white;}
div {
width:31.3%;
height: 31.3%;
margin: 0.5em;
background-color:orange ;
-webkit-border-radius: 0.5em;
-moz-border-radius: 0.5em;
border-radius: 0.5em; ;
float:left;
}
</style>
</head>
<body>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
</body>
</html>
遇到的问题：我翻看了很多师兄的日报，发现有的师兄会在<style>后面填上比如clearfloat:after{display:block;clear:both;content:"";visibility:hidden;height:0}这样的样式，也是一脸懵逼的一个个查过去，发现知道什么意思却都不清楚具体什么用，而且一些师兄是把一排3个框放一起组成，结果用google调试的时候直接变成9个竖排方块了，我也是懵了
改来改去发现还是吴师兄的简洁方便。
返回列表
评论