Safari 浏览器中的“高度：内在”是什么？

Question

我在保持图像大小方面遇到了一些困难。据我所知，为了获得更好的 SEO 得分，我们需要在 img 标签中指定宽度和高度。但我想让它响应并跟随它的父级，所以我将高度和宽度都声明为 100%。

<img src="example.jpg" width="100%" height="100%" />

对于 Chrome，它可以正常工作。图像保持其比例且未拉伸。但是在 Safari 中，图像被拉伸了。因此，当我尝试在 Safari 中调整高度时，我发现此属性 intrinsic 以某种方式解决了我的问题。但我不知道它是什么，我从来没有听说过它。那么intrinsic 是什么？

Answer 1

根据CanIUse，

较旧的 webkit 浏览器也支持非官方的 intrinsic 值，其作用与 max-content 相同。

换句话说，这与最新版 Chrome 中的height: max-content 相同。

现在我这里没有Safari，所以我不知道你是否也可以在那里使用max-content，所以最好也保留intrinsic，作为备用。

顺便说一句，自 HTML5 以来，不推荐使用以百分比表示的大小属性。所以你应该做的就是在属性中加入一些数字，然后用 CSS 改变它们应该是什么（100%，最大内容）。