1.移动端的特点

1. 手机屏幕小，网页宽度多数为100%，是适配手机屏幕宽度

2. 移动端则基本不需要考虑兼容性问题，放心大胆使用CSS新特性

3. 物理分辨率：硬件所支持的，屏幕出厂就设定无法修改

4. 逻辑分辨率：软件可以达到的， 我们开发中写的是逻辑分辨率

5. 视口（viewport）就是浏览器显示页面内容的屏幕区域

6. 视口分类:布局视口,视觉视口,理想视口

7. 视口标签:

2.百分比布局

百分比布局， 也叫流式布局

百分比布局特点:宽度自适应，高度固定。

3.flex布局

1.display: flex; 一定要给父元素加。

2.主轴对齐方式:justify-content 常见取值:

3.侧轴对齐方式:align-items 常见取值

4.伸缩比,把父盒子分为若干份数，每个子盒子各占几份。 flex:1; 一定给子盒子加 5.圣杯布局就是左右两边大小固定不变，中间宽度自适应。

6.修改主轴方向属性: flex-direction

7.弹性盒子换行显示 : flex-wrap: