CSS選擇全部，選擇一些但不是全部元素？

Question

我正在構建一個網站，在任何元素上都沒有邊框半徑，而不是在我的樣式表中多次使用outline: 0;我試圖使用*選擇器將outline: 0;應用於所有內容;

* { 
    -moz-appearance: none; 
    -webkit-appearance: none; 
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0); 
    outline: 0; 
    outline: none; 
    border-radius:0; 
} 

該CSS可以處理某些元素，例如輸入字段，但不適用於按鈕。

我使用引導，然後包括我自己的樣式表。 我的樣式表中沒有其他border-radius的實例。

爲什麼會有像這樣的圓形邊框和輪廓？

Answer 1

這是由於specificity。所述*選擇器本身具有特異性得分爲0，0，0

按鈕與焦點在自舉具有以下選擇：

.btn:focus { ... } 

這具有的0，1，1特異性得分，這意味着該聲明將覆蓋*聲明，無論放置在樣式表中的哪個位置。

這是!important可以合理使用的少數情況之一;如果你不想做，雖然，你需要找到所有地方這一聲明不重寫引導和添加這些選擇的情況下，您的選擇順序：

*, 
.btn:focus { ... } 

Answer 2

你需要添加!important與每個屬性的具體事情，你需要覆蓋。我認爲它會工作...

使用更新的代碼：

* { 
    -moz-appearance: none; 
    -webkit-appearance: none; 
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0); 
    outline: 0; 
    outline: none!important; 
    border-radius:0!important; 
}