css - 在 CSS 中, "width: fit-content;"和 "width: "fit-content(some_value); 之间有什么区别?

标签 css

MDN 网络文档将 fit-content 描述为一个函数:

https://developer.mozilla.org/en-US/docs/Web/CSS/fit-content

https://developer.mozilla.org/en-US/docs/Web/CSS/width#fit-content

width: fit-content(20em);

我找不到任何对 fit-content 被定义为不带括号的值的引用,如下所示:

figure {
  width: fit-content;
}

有什么区别?

最佳答案

需要引用the specification找到他们:

Value: auto | | min-content | max-content | fit-content(<length-percentage>)

这是 Box Sizing Level 3 规范。

稍后在 the Level 4你可以阅读:

New values: stretch | fit-content | contain

fit-content

Essentially fit-content(stretch) i.e. min(max-content, max(min-content, stretch)).

所以 fit-content = fit-content(stretch)

stretch

Applies stretch-fit sizing, attempting to match the size of the box’s margin box to the size of its containing block. See § 7.1 Stretch-fit Sizing: filling the containing block.

关于css - 在 CSS 中, "width: fit-content;"和 "width: "fit-content(some_value); 之间有什么区别?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/64668789/

相关文章:

html - 删除讨厌的图像边框

CSS 子菜单不出现 : Probably z-index issue

javascript - 我将如何使用 JavaScript 删除 nth-of-type 样式

jquery - Bootstrap 按钮对齐小屏幕宽度

javascript - onclick() 和 .on ('click' ,function()) 之间的区别?

javascript - 更改 CSS 动画 anchor

css - 如果 css 背景图像在以后的 css 中被覆盖,它仍然会被调用吗?

css - Float 和@media 查询似乎不能一起工作

html - 如何将文本与中心对齐或接近中心?

jquery - 为什么 JQuery height() 函数返回零?