ITCSS -页面专用的put类

Question

我正在使用ITCSS来构造我的样式。现在我有了一个页面，它的最大高度是512 max。这个属性是特定于页面中的图像的，所以使用ITCSS，我应该把这个属性放在哪里？该图像具有自举带的img-流体类.另一个问题是，使用ITCSS可以为特定页面创建样式，还是应该使用ITCSS“强制”的结构来组织样式？

Answer 1

这取决于您有多少特定于页面的样式。

一种方法是将图像作为图像的一种变体。像<img class="c-img c-img-fixed-hero" src="/path" />"一样使用。

.c-img {} // general image styling
.c-img--fixed-hero {} // special styling for this use case

另一种方法是创建一个页面组件，并使用修饰符为每个变体应用独立的样式。

// shared page styling
.c-page {} 

// unique home styling    
.c-page--home { 
  .c-img {} 
}

// unique about styling
.c-page--about { 
  .c-img {} 
}