今天完成的事件

 页面问题：

  刚开始我用的是浮动来达到我想要的效果就是最大分辨率是2行  1300分辨率和900是2竖行，到900后就是一竖行，而师兄的要求是，3行 4行 然后才是2竖行和1竖行，通过flex-wrap: wrap 让它自己位移 用margin达到这个效果代码如下：

1. text-align: center;
2.    margin: 0 5%;
3.    font-size: 13px;
4.    color: #999999;

在1300分辨率下 margin的值是5%效果如图：

我们看到 是通过挤压让他们自动换行，当然如果 值不够大会出现一行有1个 或者2个到3个而不对齐，这时候就需要自己多设置媒体查询进行一点一点的实验，来设置margind 值的。

 准备课堂 POSITION定位有哪几种？各有什么特点？

什么是position 它是用来定位的 经常用来定位导航栏或按钮或者你想要把一个块状元素移动到HTML某个位置上就使用position，而它的是属性值有4个：

static、relative、absolute、fixed 这个中文名称分别是静态，相对 绝对 固定，  我只用到到后面三个静态这还是第一次见到，百度查到的资料如下：

static是默认值 表示没有定位，但是如果你想要10div有9个绝对定位 那么其中一个你就可以使用它。在改变了元素的position属性后可以将元素重置为static让其回归到页面默认的文档流中。

relative相对定位一张图可以解释下面的

这是 relative向下设置20xp 我们可以看到它不想其他定位那样把下面的div覆盖点 他直接把它挤下去20px。而且它会随着html的大小进行移动而不是固定在那一直不变的。

百度解析：相对定位相对的是它原本在文档流中的位置而进行的偏移，而我们也知道relative定位也是遵循正常的文档流，它没有脱离文档流，但是它的top/left/right/bottom属性是生效的，最重要的是它还占有文档空间，而且占据的文档空间不会随top / right / left / bottom 等属性的偏移而发生变动，也就是说它后面的元素是依据虚线位置( top / left / right / bottom等属性生效之前)进行的定位，这点一定要理解。

absolute 固定定位。

如图

这里以前一直以为你用top等属性定位就会一直定位那里，但是还是比以前设置的值会有差距，因为固定等位需要寻找它的根据祖先类元素(父类以上)进行定位，也就是说如果你子类用固定定位那么 你的父类一定要有相对定位不然的话，它就直接根据根目录为止也就是html根标签为止。而且 固定定位是根据父类进行的那么如果父类的margin值那么 会对absolute影响距离的。 但用padding却没有这个问题。

这里要还要注意下；如果absolute在看不见得的地方会屏幕会出现滚动条的 它是随着html的移动而移动走的。

fixed 绝对定位，跟上面的固定定位基本上是一样的，但唯一的区别就是如果你用 top / left / right / bottom等属性生效后 那么 他就会固定在那而不会随着html移动而移走它会一直在屏幕上就跟我们看网页出现弹窗你上下滑动它就是不消失一直在那里。这个属性一般我是用来固定顶部导航栏或者登陆以及下拉框等，经常用在手机屏幕分辨率上。