~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
开发工具与关键技术：html+css3
作者：张海锋
撰写时间：2019-1-16
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
在学习前端的过程中，我觉得最重要的就是对网页的布局得有一条清晰的思路。所以我们要对布局方法有一定的了解。下面简要的说说几种常见的布局。
1.Flex弹性布局，可以简便、完整、响应式地实现各种页面布局。
而传统解决方案，基于盒状模型，需要position属性 或者float属性才能实现与其相同的布局。如图：
flex布局代码：(只需在父元素上加display：flex；就能令子元素 并排显示)
position属性 或者float属性代码：（需在每个子元素上加浮动才能令其并排显示）
而flex弹性布局还有一个属性：随屏幕宽度的改变其子元素也会随之伸缩。
2.响应式布局：媒体查询（是一种CSS语法。可以根据浏览器的特性，
一般是屏幕或浏览器容器宽度提供CSS规则。）
在刚开始学习前端时，自己做了一个静态网页。本来做出来的效果在自己电脑上看觉得很完美，但考在别人的电脑上看时样式全乱了。然后就上网查找了原因才知道，电脑的分辨率不同会导致样式的混乱，后来才知道用响应式布局：媒体查询的方法可以解决。~~最后果然弄好了。
3.栅格响应式布局（引用bootstrap）
