加入收藏 | 设为首页 | 会员中心 | 我要投稿 李大同 (https://www.lidatong.com.cn/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 百科 > 正文

当flexbox处于活动状态时,会忽略哪些css规则?

发布时间:2020-12-15 01:49:42 所属栏目:百科 来源:网络整理
导读:如何配置flexbox以获得良好的后备?说我有这个: .parent{display: flex;flex-flow: row wrap;width: 320px;border: 1px solid black;}.children{text-align: center;flex: 1;background: #DDD;} div class="parent"div class="children"1/divdiv class="chi
如何配置flexbox以获得良好的后备?说我有这个:

.parent{
	display: flex;
	flex-flow: row wrap;
	width: 320px;
	border: 1px solid black;
}
.children{
	text-align: center;
	flex: 1;
	background: #DDD;
}
<div class="parent">
	<div class="children">1</div>
	<div class="children">2</div>
	<div class="children">3</div>
</div>

我允许添加哪些规则,以便为旧浏览器提供良好的后备,并且它们会被完全忽略并且不会干扰flexbox.

请注意,我不会要求一个polifill或任何东西,我只是想要一些类似的东西.当flexbox处于活动状态时,确切地知道哪些规则被忽略会很高兴.显然会覆盖显示,但是孩子的宽度怎么样?孩子的漂浮怎么样?位置怎么样:绝对?利润率怎么样?

解决方法

根据 spec,

Flex containers are not block containers,and so some properties that
were designed with the assumption of block layout don’t apply in the
context of flex layout. In particular:

  • the column-* properties in the Multi-column Layout module 07001 have no effect on a flex container.

  • 07002 and 07003 have no effect on a 07004,and do not take it out-of-flow. However,the 07002 property can
    still affect box generation by influencing the 07006
    property’s computed value.

  • 07007 has no effect on a flex item.

  • the 07008 and ::first-letter pseudo-elements do not apply to 07009,and 07009 do not
    contribute a first formatted line or first letter to their ancestors.

针对您的具体问题,

> Flex项目宽度(假设水平流量):

The flex item’s 070011 is either the 070012 or 070013
property,whichever is in the main dimension.

如果flex-basisauto,这将用作flex basis:

When specified on a 07004,the auto keyword retrieves the
value of the 070018 as the used 070015.

否则,它将被忽略.
> Absolutely-Positioned Flex Children

An absolutely-positioned child of a 070021 does not
participate in flex layout. However,it does participate in the
070022 (see 070023),which has an effect in their painting
order.

> Flex Item Margins and Paddings

The margins of adjacent 070025 do not collapse. Auto margins
absorb extra space in the corresponding dimension and can be used for
alignment and to push adjacent flex items apart; see 070026.

Percentage margins and paddings on 070025 are always
resolved against their respective dimensions; unlike blocks,they do
not always resolve against the inline dimension of their containing
block.

Note: This behavior is 070028,and might change in a future version of this specification to match the behavior of blocks.

(编辑:李大同)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    推荐文章
      热点阅读