flex属性的设立以及用法

博主在调试回到顶部按钮位置时对flex属性有了想法并分享。介绍了flex使用前提,如display: flex用于块级元素、display: inline-flex用于行内元素。还说明了设置flex的方法之一是设置flex - direction,介绍了其取值及含义。

在本周我在回到顶部按钮的使用时因为位置问题调试时使用了flex属性从而对此有了一些想法来分享一下;
首先
display: flex; 将对象作为弹性伸缩盒展示,用于块级元素
display: inline-flex; 将对象作为弹性伸缩盒展示,用于行内元素
这是flex大致的使用前提;引用flex;之后要对flex设置属性;
我所知道的设置flex的一种方法是设置flex-direction

用于指定Flex主轴的方向,继而决定 Flex子项在Flex容器中的位置
取值:row | row-reverse | column | column-reverse
row:默认值,表示水平方向从左到右排列,此时水平方向轴线为主轴
row-reverse:与row相反
column:表示垂直方向从上到下排列,此时垂直方向轴线为主轴
column-reverse:与column相反
在这里插入图片描述

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值