作者:江苏蓝凯-我家在装修_708 | 来源:互联网 | 2021-10-30 05:05
布局的传统方案,基于盒装模型,依赖display属性+position属性+float属性。他对于那些特殊的布局非常不方便,比如,垂直居中就不容易实现。2009年,W3C提出了一种新的方案—-Flex布局,可以简便、完整、响应式地实现各种页面布局。目前,它已经得到了所有浏览器的支持,这意味着,现在就能很安全地使用这项功能。采用Flex布局的元素,称为Flex容器(flexcontainer),简称”容器”。它的所有子元素自动成为容器成员,称为Flex项目(flexitem),简
布局的传统方案,基于盒装模型,依赖display属性+position属性+float属性。他对于那些特殊的布局非常不方便,比如,垂直居中就不容易实现。
2009年,W3C提出了一种新的方案—-Flex布局,可以简便、完整、响应式地实现各种页面布局。目前,它已经得到了所有浏览器的支持,这意味着,现在就能很安全地使用这项功能。
采用Flex布局的元素,称为Flex容器(flex container),简称”容器”。它的所有子元素自动成为容器成员,称为Flex项目(flex item),简称”项目”。
今天我来分享一下我对弹性盒模型的见解和经验,如有不足之处欢迎留言指正。
在网上看过这一些关于弹性盒子模型的知识,我相信百度过这方面知识点的人都见过下面的这一幅图片,第一次看就一脸懵逼,如果先了解实验之后再来看下面这一幅图就清楚了,今天我就扯开主轴,交叉轴啥这些的不谈,后面写了一些发现还是要看一下主轴和交叉轴,,,, 简单的来可以先认为主轴就是横轴,交叉轴就是竖着的纵轴,下面看就直接来代码和效果,希望你看到过后进行实验,我相信你会对弹性盒子的知识会有很大的了解并且能够应用弹性盒子来进行布局。
在这里先介绍这么多,下一次就分享一下弹性盒子项目的一些属性,如果有不清楚的地方或者文章有不足之处,希望各位可以指正,如果你看到我的文章可以收获了一些知识,那么我会非常高兴的。
以上就是弹性盒模型-容器属性的理解 的详细内容,更多请关注其它相关文章!