BEM計量學：不同的問題（復位，混音或修改）

Question

:)

重置類：

比方說，我有一個_base.scss並有

ul { 
    margin-top: 20px; 
    margin-bottom: 10px; 
} 

是什麼BEM中最好的方法是始終重置相同的東西。我讀過全球班不是「允許」的。例如，我必須做一個scss佔位符（％resetUl），然後擴展ul-list或是某種允許的全局類嗎？恩。

<ul class="resetUl"> 
    <li class="resetLi"> 
</ul> 

BEM混合或修改： 我有兩個類似的按鈕。一個按鈕16px，另一個按20px字體大小。小的一個（16px字體大小）總是在另一個組件裏面。我必須在這裏做一個混音或修改器嗎？

混合：

修改：

<div class="header"> 
    <a class="btn btn--small"></a> 
</div> 

如果莫名其妙的設計師說：「我想要那個按鈕也是另一部分是什麼？hmm..let說... EHMM的頁腳」 ......

隨着混合：

.header__item, 
.footer__item { 
     font-size: 16px; 
} 

有了修改：

.btn { 
    //button stuff 
} 

.btn--small { 
    font-size: 16px; 
} 

雖然我在寫這似乎是這樣的東西字體大小或顏色是一種改性劑之類的東西保證金是組合？

並在這種情況下間距（保證金）問題： 你保證金的東西已經在組件或它的BEM混合？我們再來說一個簡單的按鈕。我知道這一切都是可能的，但試圖捕捉一些贊成和反對意見。

謝謝:)

Answer 1

1）您可以創建多個佔位符重置某些屬性。例如%reset-list,%reset-button。並用它擴展組件。 .button { @extent %reset-button; }。

2）改性劑或混合物。 我認爲所有外部風格，如邊距和定位應由父母組合設置。但所有的內部屬性，如顏色，字體大小等應該由修飾符設置。因爲元素不知道外部上下文。而且父母也不知道孩子（不是__element）是怎麼做出來的。

你的情況：

<div class="header"> 
    <a class="header__item btn btn--small"></div> 
</div> 

.header__item { 
    position: absolute; // for example 
} 

.btn--small { 
    font-size: 16px; 
}