流式布局记录之京东移动布局

问题：流失布局 盒子不断的拉伸 可能会将盒子里面的内容挤下来 所以为了保护盒子在合理的分为之内
通过最大宽度和最小宽度 来限制盒子的拉伸范围

max-width:最大宽度
min-width:最小宽度 以px为单位 一般给父级元素使用，限制父级的拉伸范围 使得子元素也会被限制

移动端页面要设置视口标签：

二倍精灵图的做法 以JD移动页面的搜索框中的放大镜为例
1.在fw软件中把精灵图等比例缩放为原来的一半【原来精灵图是400200 等比例缩放一半之后是 200100】【在实际fw操作中,只需要将宽度修改为原来的一半 高度软件会自动计算】
2.此时才能测出有效的坐标 ：在选中放大镜的图案 测量坐标 此时已经找到缩放后的坐标
3.由于图片在fw软件中缩放 在代码需要加上图片缩放 background-size ：原来图片宽度的一半 垂直auto

加了固定定位的盒子一定要给宽度

有图片时想到用定位做 - 有定位要考虑要不要子绝父相 -图片用盒子装着 直接给盒子定位！！
-有时候盒子装的图片太大 不能显示完整效果 此时要对盒子里面的图片进行background-size：水平 垂直；缩放
【水平和垂直都改为盒子的宽高，这个盒子指的是离图片最近且装着图片的盒子； 此时背景图默认是顶部对齐 通过设置margin改变】

外边距的塌陷问题 如何解决？

-在流失布局中 是给盒子宽度百分比 在盒子插入的图片要完整显示时给盒子中的图片添加with100%

-当有盒子掉下来的时候 考虑 box-sizing:border-box;