Flex布局,也就是Flexbox的俗称,是CSS提供的用于布局的一套新属性。这一套标准是由W3C于2009年提出并制定的。
Flex相比其他传统的布局,能更简便、更完整,并且是响应式地实现各种布局(框架不能算里面,例如bootstrap,它可以响应式,并且可以自适应),
这里稍微扩充一下:
自适应网站是使用不同设备浏览时呈现不同的网页,网页内容及版式风格或相似或完全不同,和PC端属于不同的网站模板,数据库内容或相同一致,或独立不同,目的在于为了符合访客的浏览;
而响应式网站是使用不同的设备浏览网站时,网站样式风格、内容和网址都是完全一样的,PC端和移动端属于同一个网站模板,数据库完全一致,也非常符合搜索引擎的优化规则。
简而言之:自适应是网站模板不同,使用不同设备浏览时呈现不同的网页;而响应式是同一个网站模板,使用不同的设备时呈现相同的页面(只是大小的缩放)。
好了,回到正题,假如你碰到了行内块、浮动和表格格式让你觉得无从下手,那么Flex布局很适合你;而且从现在看来,由于IE10以上都能兼容Flex,Flex布局不仅仅是应用于移动端了,可以更广泛的应用于PC端。
Flex布局这套属性它包含了针对容器(弹性容器,也就是父元素盒子)和针对其直接子元素(弹性项,也就是子元素)两类属性。Flex属性它可以控制弹性项的如下方面:
- 大小,基于内容和可用空间
- 流动方向,水平还是垂直,正向还是反向
- 两个轴向上的对齐与分布
- 顺序,与源代码中的顺序无关。
比如,在阮一峰的博客中就说到,通过一般的传统布局垂直居中就不容易实现。那么Flex布局属性有哪些??
原文地址:https://www.cnblogs.com/Nelson-Yen/p/14462225.html
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。