静态布局、自适应布局、流式布局、响应式布局、弹性布局简析、BFC

静态布局：给页面元素设置固定的宽度和高度，单位用px，当窗口缩小，会出现滚动条，拉动滚动条显示被遮挡内容。针对不同分辨率的手机端，分别写不同的样式文件。例如：浏览器窗口是1000px，那么最小的宽度是900px或其他px,只要浏览器缩小过这个最小值就不会自动化的调整。

 

　　自适应布局：创建多个静态布局，每个静态布局对应一个屏幕分辨率范围，使用@media媒体查询技术。但是字体不会改变

 

　　流式布局：rem布局+viewport;元素的宽高用百分比做单位，元素宽高按屏幕分辨率调整，布局不发生变化。屏幕尺度跨度过大的情况下，页面不能正常显示。比如，对移动端来说不错

　　响应式布局：采用自适应布局和流式布局的综合方式，为不同屏幕分辨率范围创建流式布局。

　　弹性布局：要点在于使用em和rem单位来定义元素宽度，与流式布局有极大的相似性，但也有不同之处，主要区别在于弹性布局的尺寸主要根据字体大小而变化。

 

BFC:浏览器开发人员才回去研究，格式上下文，比如：解决了高度塌陷

转载于:https://www.cnblogs.com/yangwan/p/10169242.html