为什么未设置宽度/高度效果对象适合＆amp;有工作吗？

Question

简介

虽然使用未设置的值与规则对象匹配，但我遇到了一些奇怪的行为，并想知道这个问题是否存在原因/工作问题。

实施例

.block {
  &__img {
    width: 100%;
    height: 50%;
  }

  &--portrait {
    .block__img {
      width: unset;
      height: unset;
      object-fit: cover;
    }
  }
}

在此代码中，即使使用object-fit样式规则（图像保持其原始高度和宽度而不是cover宽度），图像的高度和宽度也会被设置。为什么unset会影响具有不同名称的规则？

当css被呈现时，object-fit和height / width幕后会发生什么事吗？

Answer 1

图像的CSS尺寸从级联中移除，但图像仍保留其固有尺寸。因此，图像框（即为图像生成的CSS框）将使用这些内在维度进行渲染（请参阅CSS2的10.3.2和10.6.2部分），let mainController = MainController() mainController.performSegue(withIdentifier: "detailSegue", sender: cell) 表现为否与object-fit: cover不同，因为框的纵横比不变。

这不是object-fit: fill关键字的问题。 unset的本质意味着其行为直接受object-fit和height值的影响。