9.17学习笔记

1.手机页面的PSD文件上面标注的是PX单位，ihone6位标准

2.我们编写代码的时候，推荐使用 rem+px。

3.通常会加一段JS代码，根据当前设备宽度动态调节font-size的大小

4.rem单位的元素也会随之变化（rem表示HTML标签上font-size的倍数）

#弹性伸缩盒子

父标签{display:flex;}

子标签{flex:1;}

子标签{flex:2:}

/*将父标签的宽度分成3份，孩子各占三分之一，高默认占满*/

#flxe-direction

父标签{

display:flex;

flex-direction:row;/*从左到右排列（默认）*/

flex-direction:row-reverse;/*从右到左排列*/

flex-direction:colum;/*从上到下排列*/

flex-direction:colum-reverse;/*从下到上排列*/

}

#justify-content（水平）

父标签{

justify-content:flex-start;/*左对齐（不是绝对的）*/

justify-content:flex-end;/*右对齐（不是绝对的）*/

justify-content:center;/*居中*/

justify-content:space-between;/*两端对齐*/

justify-content:space-around;/*两端对齐且两边有间距*/

}

#align-items(垂直)

父标签{

align-items:flex-start;/*顶部*/

align-items:flex-end;/*底部*/

align-items:stretch;/*拉伸（占满）*/

align-items:baseline;/*基线对齐*/

align-items:center;/*居中*/

}