基于弹性的示例:内容

Question

我注意到在flexbox规范中flex-basis可以设置为content.

我正在尝试在HTML中使用它.但它不适用于chrome.

有人能告诉我一个例子flex-basis: content吗？

谢谢.

Answer 1

请注意,content大多数主流浏览器尚不支持该值.

这是MDN的截图:

有关内容的解释content,MDN也很有帮助:

content

表示基于弹性项目内容的自动大小调整.

注意:请注意,此值在Flexible Box Layout的初始版本中不存在,因此一些较旧的实现将不支持它.通过auto与主要尺寸(宽度或高度)一起使用可以获得相同的效果auto.

注意:简史

• 最初,flex-basis: auto意思是"看看我的宽度或高度属性".
• 然后,将flex-basis: auto其更改为自动调整大小,并将"main-size"作为"查看我的width或height属性"关键字引入.
• 然后,这个改变被还原了,所以auto再一次意味着"看看我的宽度或高度属性"; 并content引入了一个新的关键字来触发自动调整大小.

_{来源:https://developer.mozilla.org/en-US/docs/Web/CSS/flex-basis#Values}