|移动端布局方式有哪些?

【|移动端布局方式有哪些?】|移动端布局方式有哪些?

文章图片

|移动端布局方式有哪些?

文章图片


我们在建立WAP端移动页面的时候 , 会有两种布局方式:流式布局和响应式布局 。

1.流式布局流式布局是一种等比例缩放布局方式 , 在CSS代码中使用百分比来设置宽度 , 也称百分比自适应的布局 。流式布局实现方法是将CSS固定像素宽度换算为百分比宽度 。
2.响应式布局响应式布局就是一个网站能够兼容多个终端——而不是为每个终端做一个特定的版本 。 这个概念是为解决移动互联网浏览而诞生的 。
响应式布局可以为不同终端的用户提供更加舒适的界面和更好的用户体验 。
3.移动端初始化css样式为了方便初始化css样式 , 我们可以用如下步骤搜索:

4.flex布局原理flex布局原理可以概括为通过给父盒子添加flex属性 , 来控制子盒子的位置和排列方式 。 flex用来为盒状模型提供最大的灵活性 , 任何一个容器都可以指定为flex布局 。
5.flex布局和流式布局的区别传统
兼容性好
布局繁琐
局限性 , 不能再移动端很好的布局
flex布局
操作方便 , 布局极其简单 , 移动端使用比较广泛
pc端浏览器支持情况比较差
IE11或更低版本不支持flex或仅支持部分