第一次写日报有点小紧张，大概这不算是个日报了，是个周报

花了六天时间差不多完成了第一阶段的任务，虽然写在task3的日报里，但内容上也涉及到task1，2（原谅我有点懒，没有每一个任务都写）

来这里以前差不多是小白一个，除了能看懂html和css以外几乎啥也不会，Github账号虽然早就有了，可一点都不会用，挣扎好几天终于有点入门

所以首先来说说GitHub

第一步,申请账号

不多说，直接去GitHub官网申请，我啥也不会的时候也能申请一个

第二步，有了账号就得建个库

这里要说一下建GitHub Pages的库，有了个人主页才能舒服展示代码效果（我有点笨，也是昨天在师兄的指导下才彻底整明白这东西）

特别要注意库的名称，你的账号是#####，所以库名就是#####.github.io

比如我的账号是AK774357165，所以库名就是AK774357165.github.io（因为我已经建过这个库所以再建就重名了）

我还去申请了一个域名，顺便吐槽一下，看得顺眼顶级域名真难申请，连我的名字都早就被注册了，经过一晚上的挣扎终于找到了一个还算简单的单词还没被注册过（强迫症使我不接受加数字的行为），阿里云55rmb/年成功注册。接下去就是绑定域名然后去阿里云解析域名，完了以后就能用域名访问github上的个人主页了。

第三步，建完了库进行内容填充

先把GitHub上的库clone到本地，熟悉git的可以用git操作，不熟悉的也可以下一个GitHub的客户端一键克隆到本地

clone完了就有本地仓库了，然后在.git所在目录建一个index.html文件，这个就是主页了。

然我我再建了一个仓库，用来放任务文件

注意地下那个勾要打上

然后去Setting，滑下去找到GitHub pages

改成master branch 然后 save，再把这个库clone到本地，在.git所在目录建task1 task2 task3....的文件夹用来保存任务

每一个文件夹中还可以分image文件夹，css文件夹等，这样路径就会很清楚并且把不同格式的文件进行分类，方便以后做复杂项目时找文件

我仿照师兄的主页做了主页html，方便提交任务

这里注意避免使用绝对路径，因为使用绝对路径在本地预览没问题，一旦提交到github上，就失效了。同理外联css的路径也要使用相对路径，保证提交以后，css文件能发挥作用（ps.我之前一直没搞清楚这个东西导致传上去的页面只有html效果没有css效果，百度了半天试了无数种方法看到了很多高级的东西，可就是解决不了我的问题，真的很抓狂，也许大佬们都不觉得这是个问题吧，也可能是我百度的姿势不对？？或者是我一开始的文件就很乱，自己都不清楚路径）

顺便讲一下相对路径

首先需要找到两个文件的共同根目录（比如我index.hrml和task1，task2，task3同属于一个库的根目录）然后再加上子目录，比如：

主页中index.html文件位置：XXX/index.html

task3中index.html文件位置XXX/task3/index.html

想要找到共同的根目录就要用到“../”这个路径的意思是上一级目录，“./”这个路径的意思是同级目录，“../../”的意思就是上两级目录，

因为task3文件与主页的index.html同在一个XXX目录下，所以使用“./task3”进入task3的目录再用“/index.html”选中task3的任务主页

img的href和background的url同理。

先按以上操作一遍，今后就能很顺利的提交任务了ps.我走了好多弯路，最后还得靠师兄帮忙才有所领悟，所以在这里真诚感谢各位师兄的热心帮助。

关于html和css的东西能说的感觉不多，以前自己学过一段时间，就目前来看大多数时间花在学用git apache github  上面了。

有关css的主要还是自适应和外联,外联主要是路径的问题上面已经说过了，这里主要讲自适应，顺便提一下切片

之前做html css的练习一般套路就是FW切片然后量大小，直接在css里面还原，然后现在学会了用ps切，感觉更好用了因为有秘密武器。

这个秘密武器等一下再说，先讲自适应。

px 像素 是相对显示器分辨率而言的 如果一个对象尺寸单位是“px”那么这个对象大小固定，在某一特定显示窗口大小时，页面显示正常，但当窗口缩小或者在更小窗口的设备比如移动设备上打开该页面就会出现下方滚动条，影响视觉效果，因此将尺寸设置为以“%”为单位，这样就可以保证内容大小与视口大小的比例保持不变，当窗口缩小时，内容等比例缩小，这样就避免了下方滚动条的出现。

同时引入“em”和“rem”两个单位，“px”的另一个问题是IE浏览器无法调整那些以“px”做单位的字体大小。em是相对长度单位。相对于当前对象内文本的字体尺寸。如果当前对行内文本的字体尺寸未被人为设置，则相对于浏览器的默认字体尺寸。

浏览器的默认字体大小是16px，那么未经调整的浏览器中1em就等于16px，则1px等于0.625em。为了计算简单，在body中声明Font-size = 0.625后，1em就等于了10px（16*0.625 = 10），所以接下去设置长度时把以px做单位的数值除以10再加上em做单位的效果就跟以px做单位时一样了，但保证了在IE浏览器中可以被改变大小。

‍‍rem是CSS3新增的一个相对单位（root em，根em），这个单位引起了广泛关注。这个单位与em有什么区别呢？区别在于使用rem为元素设定字体大小时，仍然是相对大小，但相对的只是HTML根元素。这个单位可谓集相对大小和绝对大小的优点于一身，通过它既可以做到只修改根元素就成比例地调整所有字体大小，又可以避免字体大小逐层复合的连锁反应。

最后讲一下切片的秘密武器

‍

就用task4中的页面做例子 文件——>脚本——>将图层导出到文件

设置好目标文件夹，文件前缀名，把文件类型选为PNG-24，下面三个框全选，然后点运行，然后最小化ps干别的事情去吧。

几分钟以后，你的目标文件夹里会出现。。真·全自动，切的还挺精细，连阴影都没放过全切出来了，虽然可能会有一些多余的，直接删掉就行了

‍‍扯了很多，就是不说task3的东西，嘿嘿嘿，可能关注点不一样，相信后面的任务里面‍‍会有更多新的知识可以着重写一下。

写完了才发现下面居然还有格式，这次就不改了，下次注意吧嘿嘿嘿,就加个明天计划的事吧。

明天计划的事:

上午要确保task4能完美通过师兄的检查。

下午开始task5，并且初步了解一下媒体查询并实现在不同窗口宽度下调用不同的css效果。

要是下午能完成任务，那么晚上再补一篇关于媒体查询的日报。