前端开发

flex中的margin:auto水平垂直居中深入理解

2019-05-2412次阅读flexbox
我们都知道通过Flex容器+Flex项目的margin:auto;可以轻轻松松实现水平垂直居中。还真没有深入探究margin:auto是如何做到的。直到今天无意间看到《探秘flex上下文中神奇的自动margin》一文,作者解释的很好,所以这里做一下笔记。理解的重点还是在BFC(块格式化上下文) 、FFC(Flex格式化上下文)、GFC(Grid格式化上下文)。
前端开发

拥抱Flexbox弹性布局基本概念之Flex项目

2019-05-1636次阅读flexbox
上一篇介绍了Flex容器属性,本文将介绍Flex项目属性order、flex-grow、flex-shrink、flex-basis、flex、align-self。
前端开发

拥抱Flexbox弹性布局基本概念之Flex容器

2019-05-1538次阅读flexbox
长期以来使用表格、浮动、清除浮动、行内块元素和其他CSS属性来布局网站内容。当制作一些复杂的页面时就比较吃力,不得不使用css Hack、css黑魔法来实现,例如水平垂直居中,等高布局等。Flexbox的目的就是改变这一切,最起码可以让你告别浮动、清除浮动。。。让布局更简单更智能。注: Flexbox布局最适合应用程序的组件和小规模布局,而Gird布局则适用于较大规模的布局。