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

Question

我想知道下面第 5 个 div 会发生什么：

<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%。我理解正确吗？这是来自 Masonry 教程： https://masonry.desandro.com/options.html

Answer 1

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

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

What happens when you specify two width sizes in Masonry?

html

javascript

jquery

jquery-masonry

masonry