当您在砌体中指定两个宽度尺寸时会发生什么？

Question

我想知道下面的第5格会发生什么：

<div class="grid">
  <div class="grid-sizer"></div>
  <div class="gutter-sizer"></div>
  <div class="grid-item"></div>
  <div class="grid-item grid-item--width2"></div> //This one...
  ...
</div>

JS是：

.grid-sizer,
.grid-item { width: 22%; }

.gutter-sizer { width: 4%; }

.grid-item--width2 { width: 48%; }

在我看来，我们将宽度设置了两次-22％和48％。我理解正确吗？这是从砌体教程：https://masonry.desandro.com/options.html

Answer 1

块.grid-item--width2 { width: 48%; }将适用。不能有“两个宽度”，后一个将优先，因为它们具有相同的特异性（您可以阅读有关选择器特异性的信息here）