为什么clip属性只对position: absolute或position: fixed的元素有效?

Question

为什么clip属性只对position: absolute或position: fixed的元素有效?为什么它不能与相对或静态定位。这是我的代码。小提琴

<span>Hover me</span>
<img src="http://sambuh.com/assets/images/news%20headlines/bukhara-autumn1.jpg">

img {
  position: absolute;
  left: 10px;
  top: 60px;
  display: block;
  clip: rect(200px, 0, 0, 400px);
  -webkit-transition: all 0.5s ease-out;
  -moz-transition: all 0.5s ease-out;
  transition: all 0.5s ease-out;
}
span:hover ~ img {
  clip: rect(0px, 400px, 400px, 0);
}

Answer 1

因为它没有。

为什么规范这么说，这是一个非常不同的问题，我没有答案:)

Answer 2

对于您的问题需要了解各种css定位属性的区别。

以下是一些有用的链接:

1. 不同位置的CSS剪辑属性
2. 差异b/w CSS位置
3. CSS定位的实用说明

Answer 3

clip:rect(0, 0, 0, 0)已弃用，您应该使用:clip-path:inset(0 0 0 0)，它适用于相对定位