今天完成的事情：（完成任务三的布局，首先使用ps对任务资源文件进行切图，得到需要的图片，并应用到css布局中。

查看深度思考问题：

px、em、rem、%、vw、vh、vm等单位有什么区别？

px就是pixel的缩写，意为像素。px就是一张图片最小的一个点，一张位图就是千千万万的这样的点构成的，比如常常听到的电脑像素是1024x768的，表示的是水平方向是1024个像素点，垂直方向是768个像素点。

em。参考物是父元素的font-size，具有继承的特点。如果自身定义了font-size按自身来计算（浏览器默认字体是16px），整个页面内1em不是一个固定的值。

rem，相对于根元素html（网页）的font-size，不会像em那样，依赖于父元素的字体大小，而造成混乱。

%，一般宽泛的讲是相对于父元素，但是并不是十分准确。

1、对于普通定位元素就是我们理解的父元素

2、对于position: absolute;的元素是相对于已定位的父元素

3、对于position: fixed;的元素是相对于ViewPort（可视窗口）

vw，viewpoint width的缩写，视窗宽度，1vw等于视窗宽度的1%。

vh，viewpoint height的缩写，视窗高度，1vh等于视窗高度的1%。

vm，相对于视口的宽度或高度中较小的那个。其中最小的那个被均分为100单位的vm。

如何进行自适应网页设计？

1、在HTML头部增加viewport标签。meta name="viewport" content="width=device-width, initial-scale=1

2、不使用绝对宽度

3、使用流动布局：float的好处是，如果宽度太小，放不下两个元素，后面的元素会自动滚动到前面元素的下方，不会在水平方向overflow（溢出），避免了水平滚动条的出现。

css有哪些选择器，优先级如何计算？

权重计算：

1、在属性后面使用！important会覆盖页面内任何位置定义的元素样式。   infinity

2、作为style属性写在元素内的样式                                                           1000

3、id选择器                                                                                               100

4、类选择器                                                                                                10

5、标签选择器                                                                                              1

6、通配符选择器                                                                                           0

明天计划的事情：（进行任务四的学习。）
遇到的问题：（不会使用ps切图，通过师兄教导与百度学会。）
收获：（利用float来实现布局。利用 text-align: center来居中。可以在img标签后面直接使用width，height来定义图片的尺寸，也可以使用class选择器，在css里面设置图片的尺寸。）