发表于： 2016-06-24 17:52:20
1 1383
今天完成的事情。
1.九宫格做出来了，下面贴代码
2.nginx的配置
3.适应手机和F12调试
明天计划的事。
1.继续学习适应手机和F12，下午出去了一趟没学习，明天补上
2.开始任务2
遇到的困难。
1.我配置完了nginx为啥一直是404呢，error里一直报The system cannot find the path specified。
收获
前面的学习走了很多弯路，我把主要精力都放在了HTML上，导致学习节奏一直很慢，不过在学习CSS的时候大部分都了解一些了，HTML的很多内容夹杂着CSS代码，一边学习一边百度所以CSS的很多知识都是扫了一遍。如果基础和我一样的我建议先学习慕课网的《HTML+CSS基础课程》，学习的时候可以在旁边敲敲代码，毕竟刚接触你是不会webstorm的。W3C确实非常好，可以两者结合起来一起看，我就是这样两个资料来回倒着学的。
咱们的任务里也有很多资料，我这只是个人的一些小资料，对我的学习也有一定的帮助，好东西要分享给大家。
适用于新手！
自适应http://www.ruanyifeng.com/blog/2012/05/responsive_web_design.html
盒子模型http://www.cnblogs.com/wangfupeng1988/p/4287292.html
nginx详解http://www.2cto.com/os/201212/176520.html
webstorm11汉化版https://www.douban.com/note/534242662/ 豆瓣的一个帖子下面有下载地址
九宫格代码一开始做的时候不知道从哪下手，参考了参考师兄们的九宫格
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" name="viewport" content="width=device-width, initial-scale=1" >
<title>九宫格</title>
<style type="text/css">
.big{
width: 40%;/*用百分之四十是因为看起来好看一点，用百分之一百太大了*/
margin: auto;
}
.small{
float: left;
width: 30%;
padding: 15% 0;
margin: 1%;
border-radius: 0.5em;
background: #e8830d;
overflow: hidden;
}
</style>
</head>
<body>
<h1 align="center">九宫格</h1>
<div class="big">
<div class="small"></div>
<div class="small"></div>
<div class="small"></div>
<div class="small"></div>
<div class="small"></div>
<div class="small"></div>
<div class="small"></div>
<div class="small"></div>
<div class="small"></div>
</div>
</body>
</html>
返回列表
评论