首页
首页
沸点
课程
直播
活动
商城
APP
插件
搜索历史
清空
创作者中心
写文章
发沸点
写代码
会员
掘金会员,重磅登场
限时五折,已预约用户享专属抵扣
登录
flexbox
19846 关注,542 文章
关注
热门
最新
最热
青衣画白扇
7天前
前端
flexbox
一生之敌布局之flex(三)
这是我参与「掘金日新计划 · 8 月更文挑战」的第5天,点击查看活动详情 父项中的最后一个属性 flex-flow 这个属性其实 flex-durection和 flex-wrap属性的复合属性(也就
1076
22
5
Running53
8月前
前端
原来flex布局还能那么细?
很多人都学过flex布局,但是里面的细节你有注意过吗?本篇文章主要是从flex的文档入手,分析出你还不知道的flex
2.3w
384
42
TianTianUp
1年前
flexbox
CSS
「一劳永逸」48张小图带你领略flex布局之美
48张图带你从0到1掌握flex布局方式。 需要本文的Xmind导图的话,移步公众号--前端UpUp,回复flex关键字即可。 从上面图来看,我们将flex布局分为两部分讲,轴和容器。 打个预防针,flex布局涉及到12个CSS属性,父容器,子容器各6个。 接下来先梳理常见的属…
4.1w
1227
76
潜水的鱼儿
8月前
flexbox
iOS
前端
iOS盒子布局之YogaKit
前言 未来大前端是一个趋势,对于布局方面盒子布局FlexBox也是趋势,我们iOS开发中,怎么使用盒子布局呢? 1. iOS 原生布局 1.1 iOS布局介绍 在iOS开发中常用的是下面2种 Fram
1.0w
30
19
CUGGZ
11月前
前端
CSS
flexbox
彻底理解CSS Flexbox布局,看这一篇就够了!
Flexbox布局的概念 Flexbox布局也叫Flex布局,弹性盒子布局。它的目标是提供一个更有效地布局、对齐方式,并且能够使父元素在子元素的大小未知或动态变化情况下仍然能够分配好子元素之间的间
9153
103
9
毛瑞_三十课
4年前
CSS
前端
flexbox
【基础知识】Flex-弹性布局原来如此简单!!
布局的传统解决方案是基于盒状模型,依赖 display + position + float 方式来实现,灵活性较差。2009年,W3C提出了一种新的方案-Flex,Flex是Flexible Box的缩写,意为”弹性布局”。Flex可以简便、完整、响应式地实现多种页面布局。下…
3.5w
992
23
Barrybooy
4年前
GitHub
CSS
前端
🚨Web开发者需要知道的CSS Tricks
作为一名Web开发者,CSS是必备技能之一,我一直以为自己对CSS的掌握已经够用了,直到读Lea Verou的《CSS揭秘》时,我发现自己充其量就算个会打CS的选手,书中针对我们常见的网页设计难题从不同的角度提出了多种实用又优雅的解决方案,在这里强烈的推荐给每一位从事前端相关的…
2.3w
1433
51
AlienZHOU
4年前
CSS
flexbox
浏览器
一篇全面的CSS布局学习指南 [译]
无论你是一个想要学习CSS布局的新手,还是一个比较有经验但想要进一步巩固与了解最新CSS布局知识的前端开发者,这篇指南都能帮你全面了解如今CSS布局发展的现状。 在过去的许多年中,正如翻天覆地的前端开发一般,CSS布局也产生了巨大的变化。现在我们有需要可选的CSS布局方式来开发…
3.2w
497
12
Sunflower127
3年前
CSS
前端
flexbox
CSS实现footer“吸底”效果
一是无论内容的多少,我们都希望使按钮,固定于可视窗口的底部,且内容区是可滚动的。 二是当内容区的内容较少时,页脚区不是随着内容区排布,而是始终显示在屏幕的最下方;当内容区的内容较多时,页脚能随着内容区的增高而撑开,始终显示在页面的最底部。 谈到“吸底”效果的实现,大家可能较多了…
3.0w
308
35
TommyFu
4年前
CSS
前端
flexbox
Web自适应布局你需要知道的所有事儿
有这样一个问题。 别急,下面我们就开始逐一分析各种方法在web自适应布局下的使用姿势,最后做个总结。 本文的所有例子使用了同一种三栏布局。源代码点我 1. 浮动布局 float:left|right 最常用的布局方式之一,设置了float的元素脱离了文档流。需要注意在使用过浮动…
2.0w
903
34
Delicia_Lani
8月前
CSS
flexbox
Flex布局详解(含实例代码)--flex: 1 1 auto;flex: 0 0 auto是什么意思?
这是我参与11月更文挑战的第18天,活动详情查看:2021最后一次更文挑战 Flex布局的出现? 在阮一峰老师的文章中(Flex 布局教程:语法篇 - 阮一峰的网络日志)提到了,Flex布局是在什么背
2405
25
评论
mapengfei
4月前
前端
flexbox
前端er-必知必会Flex布局
一起养成写作习惯!这是我参与「掘金日新计划 · 4 月更文挑战」的第6天,点击查看活动详情 一.Flex布局是什么 Flex是Flexible Box的缩写,意为”弹性布局”,用来为盒状模型提供最大的
650
5
2
ZenonHuang
4年前
iOS
flexbox
响应式设计
iOS 上的 FlexBox 布局
最近时不时的听到关于 FlexBox 的声音,除了在 Weex 以及 React Native 两个著名的跨平台项目里有用到 FlexBox 外,AsyncDisplayKit 也同样引入了 FlexBox 。 Frame,直接设置横纵坐标,并指定宽高。 Auto Layout…
2.1w
210
43
QFifteen
3月前
flexbox
响应式布局之flex布局详细了解
Flex:‘弹性布局’ 一、指定为Flex布局 任何一个容器都可以指定为Flex布局,如果值为flex则容器为块标签 容器默认存在两根轴, 水平主轴是main axis,结束位置叫做main end;
437
4
评论
火星飞鸟
1年前
前端
flexbox
学习flex布局,看这篇就够了!
这是我参与8月更文挑战的第6天,活动详情查看:8月更文挑战 Flex是Flexible Box的缩写,表示弹性布局,用来为盒子模型提供最大的灵活性。 任何一个容器都可以设定为flex布局: 设定为fl
1752
45
3
尤小小
2年前
flexbox
【教未来男朋友学前端】flexbox 收缩算法(上)
基础的flexbox布局方法,大家都比较熟悉了,日常画页面 flexbox 布局用的66的,灵活布局、不同移动设备的适配我也不在话下,可是同事问我:“知道flex的具体是怎么计算的吗”,我一脸懵,我也不清楚呢,既然不懂就要学🤦♀️,写给未来男朋友呀。 今天就写篇 flex …
5803
47
73
一叶飘舟Finder
1年前
Android
flexbox
Android 巧用 flexboxLayout 布局
FlexBoxlayout是Google推出的开源的可伸缩性布局,在项目中也会经场使用,大大提高了用户的体验。compile 'com.google.android:flexbox:1.0.有前端基础的同学估计都知道 CSS 中这个布局,用来为盒状模型提供最大的灵活性。因为 an...
3074
13
1
锐玩道
2年前
flexbox
迅速搞定Flex布局
采用Flex布局的元素,称为Flex容器container。它的所有子元素自动成为容器成员,称为Flex项目item。 容器中默认存在两条轴,主轴(main axis) 和交叉轴(cross axis)。项目默认沿主轴排列。单个项目占据的主轴空间叫做main size,占据的交…
6257
118
6
考拉海购前端团队
4年前
CSS
前端
算法
未来布局之星Grid
Grid-layout不是为了取代flex-layout,它是flex的补充。grid擅长二维布局,flex擅长一维布局。他们需要各司其职。 千呼万唤始出来的grid-layout终于在2017年3月开始支持得到了部分浏览器的支持。 flex并不能满足我们对于页面整体布局的需求…
9796
381
10
记忆深处的声音
4月前
前端
flex布局/弹性布局与 Bootstrap 全局 CSS 样式
flex布局/弹性布局 对flex布局兼容问题 登录https://caniuse.com/,可以查到任何技术 less语法讲解 **Bootstrap 是最受欢迎的 HTML、CSS 和
438
8
评论