文章关键字 ‘flex’

flex:0 flex:1 flex:none flex:auto应该在什么场景下使用?

2020年10月6日,星期二

flex:initial适合小部件元素的分布布局,flex:0适合用到替换元素的场景,flex:none适合按钮等不换行的小控件,flex:1适合等分布局,flex:auto适合基于内容动态适配的布局,具体的剖析可以点击链接进行查看。

阅读全文…

CSS flex属性深入理解

2019年12月22日,星期日

CSS flex深入理解

一文轻松弄懂CSS flex简写语法的含义,从此各种自适应布局驾轻就熟。细节,深入,用心的案例,静心制作的演示说明GIF,全为了让你更轻松地理解与更容易地学习。

阅读全文…

让CSS flex布局最后一行列表左对齐的N种方法

2019年08月15日,星期四

最后一行列表对齐

本文提供了6种方法,用来解决最后一行的列表的不满,最后一行没有完全垂直对齐的问题。每种方法都有其适用场景,希望本文内容可以对您的学习有所帮助。

阅读全文…

粉丝群第1期CSS小测点评与答疑

2019年01月12日,星期六

小测头图

上周新建了一个粉丝群,周三发小测题目,每周依次是CSS、DOM和JS,周六上午答疑,答疑方式是直播加群聊。然后今天上午进行了第一次的直播答疑,是一个简单的CSS布局问题,本文可以看成是本次答疑的文档版。如果你也想要加入粉丝群,可以参见文末的信息。

阅读全文…

写给自己看的display: flex布局教程

2018年10月28日,星期日

display:flex布局

本文详尽介绍了display:flex布局的各个属性,最大的优点在于所有flex相关属性值的样式表现都是实时渲染的,点击不同的属性值,就可以立即实时看到不同的布局效果,非常直观。同时,很多属性的规则描述要比现有的很多文章介绍的要更详尽,对于初学者一定是一个很不错的学习教程。

阅读全文…