Time：8.6.19

    昨天加入了IT修真院，选了学习css，并且领了任务1，资料从昨天下午看到今天，emmmm脑仁疼。

    虽然很累，但是收获真的很大。

    先说一下我的情况吧：因为来这前就学习过相关的各种计算机技术，从初二CE、易语言开始，又了解了java、pyhon、unity（都没怎么学）等，又学的C/C++和前端方面。因为接触时间短，什么都不了解（既不知道啥是啥，更不知道该学啥）的情况下根本没法专一的学某一方面。现在我是高一了，已经有很长的一段时间了，所以我现在是想专注学C和前端。

 收获：

  1.今天（不是）学习了html、css基础（之前就会）

  2.float浮动的相关知识

  3.Css盒子模型（已整理好笔记）

  4.viewport（不过感觉用处不算大；已整理好笔记）

  5.flex（已整理好笔记）

 遇到的问题：

  1.做任务一九宫格不能居中。看了一位师兄的也是这样写的。

唉，查了下资料，padding属性设为百分比是根据宽度而自适应的，因此要设置每个格子的宽度。

错误案例：

.swag{

  padding-left:31%;

  padding-bottom: 31%;

  margin:1%;

  border-radius: 20%;

  background: orange;

  float:left;}

修改的话，只需要把“padding-left:31%;”改为“width:31%;”就好了，是不是很简单？是哇( ⊙o⊙ )！

  2.由于我做任务用了两种方法，所以在用第二种的时候，接触到flex布局，当然啊，查了一大堆资料呢

写出来后看似很合理，但其实，整个九宫格下面与网页没有边距了。

或许有人疑问为什么设置body的下内边距呢？设置body的下内边距后，每个格子30，加上中间的3个3外间距应该102了。

其实不然，先设置的事body的下边距3，而div格子在body中，是按照body的规格自适应的，所以30|3都不是相对整个网页的，而是相对body-concent的。只需要加上：

body {   

    padding-bottom: 3%;} 就好了。  

用图解释下：

至于横行，有flex将对象作为弹性伸缩盒显示，“justify-content: space-around”定义项目左右端对齐，中间格子间隔相等。

3.至于第三种方法，从？？那找来的，emmmm，first？？、last？？-child ，什么东西？！ 明天再看

  不多说别的，真的是累死了，大部分时间用在搭建网页了/笑哭，

 明天计划：

  1.今天弄了个服务器，想下载宝塔，搭建个手游来着，不知啥原因总是弄不成，明天得好好查下资料

  2.今天搭建博客展示作业，但是目前的思路是每个任务独立一个文件夹（任务展示模板相同），这样太浪费，想法：js技术在一个网页中用下拉框选择任务序号，在网页中一个div或box？中引入任务的内容，这样只需要一个网页就可以了，只把内容分开，不知道a href行不行，明天查下资料吧

  3.NOIP还等着我呢，学C，刷题。