移动web开发基础

完成的事

1. 实验了内联元素在排版上的情况，
2. 学习了flex布局，并应用开发简单页面。
3. 媒体查询@media相关的知识，了解了其关于自适应的关系。
4. 了解了rem对自适应的影响。

解决的问题

1. rem是怎么自适应屏幕宽度的变化的，其实是通过js动态获取屏幕宽度的变化的程度，让html字体大小也同样程度变化，即实现rem等比扩大和缩小
2. inline元素设置宽高不起作用，但设置padding,margin,border是起作用的，其padding，margin,border不再文档流之中。其自身宽高不受父容器限制。
3. img等inline-block元素可以设置宽高，但也inlie元素的特性，其宽高不会受文档流的控制
4. inline-flex实际类似于inline-block,inline-flex容器大小由内容决定，但可自行设置宽高，flex布局的容器宽度不因内容变化。

仍有的困惑

1. rem自适应屏幕的方式只参考了屏幕宽度的变化，高度呢？要不要考虑

开发步骤

flex布局的简单应用

1. 主要应用flex布局在垂直方向的居中和在水平方向的两端对齐或各项间距相等拉开对齐
2. 布局后，可有padding，margin来控制间距缝隙，行内元素可以用宽度，和其自身属性来排列

关于flex

采用flex布局的容器有两个轴，各项目按照主轴去排列，direction方向即改变主轴的方向和项目在主轴上的排列方向，是横还是行，是从左到右排列还是反过来,即row,column,row-reverse。那要是主轴排不下，可以选择换行wrap，还可以选择向上换行，wrap-reverse。flow就是两者的结合属性。
定义主轴上的排列方式还可以定义主轴上的对齐方式，是从主轴开始对齐还是末尾处开始对齐，还是中间对齐。是各个之间拉开间距，还是两端靠着边然后拉开边距。说完主轴再就是交叉轴，交叉轴上与内联的垂直对齐方式差不多，有居中对齐，基线对齐等