除了具有特定類別的輸入之外的所有輸入的樣式

我爲頁面上具有文本類型的所有輸入定義了CSS樣式。我在我的頁面的一部分使用Spectrum Color Chooser，這是實現到使用除了具有特定類別的輸入之外的所有輸入的樣式

<input type="text" class="basic" />

我試圖重寫，我已經使用適用於文本類型的所有輸入的「全球性」風格的頁面以下，但它不工作：

input[type=text]:not([class=basic]), select { 
    height:28px; 
    border:1px solid #c5d1db; 
    padding-left:5px; 
    padding-right:5px; 
    color:#627686; 
    font-size:13px; 
    box-shadow:inset 0 4px 5px 0 #ebebeb; 
    margin:0; 
}

有沒有辦法來重寫這個？

來源

2012-12-10 Jon

將您的新樣式放在CSS樣式中後，請確保覆蓋您在第一種樣式中所做的所有設置。 CSS的特殊性應該照顧其餘的而不必擔心添加這樣的自定義選擇器 –

我真的沒有看到這個問題，這不是CSS特異性的一點嗎？ http://jsfiddle.net/calder12/GBH8b/

input[type=text]{ 
height:28px; 
border:1px solid #c5d1db; 
padding-left:5px; 
padding-right:5px; 
color:#627686; 
font-size:13px; 
box-shadow:inset 0 4px 5px 0 #ebebeb; 
margin:0; 
} 

input[type=text].basic{ 
height:18px; 
border:1px solid #000; 
padding-left:5px; 
padding-right:5px; 
color:#627686; 
font-size:13px; 
margin:0; 
}

來源

2012-12-10 18:25:18

是的，我發佈後，我意識到了自己的愚蠢。一直盯着這個樣式表太多天。這工作。 – Jon

哈哈，夠公平的。有時候，只需要第二組眼睛，就在那裏做了！ –

'input [type = text]：not（.basic）'也可以......但是更容易重寫。 – BoltClock

-1

只聲明!important，因爲它會覆蓋主。

input[type=text]:not([class=basic]), select { 
    height:28px !important; 
    border:1px solid #c5d1db; 
    padding-left:5px; 
    padding-right:5px; 
    color:#627686; 
    font-size:13px; 
    box-shadow:inset 0 4px 5px 0 #ebebeb; 
    margin:0; 
}

來源

2012-12-10 18:20:42 Moiz

重要的是最後的手段，而不是一個很好的選擇。 –

Nooooooooooooo！ – Madbreaks

的CSS代碼貼作品，影響不在類領域，在支持的瀏覽器（包括現代瀏覽器一般，但不包括IE 8的舊）。

顯然，它並不影響爲的字段。但是，通過這個更受限制的規則替換適用於所有輸入字段的現有規則將會產生變化。

來源

2012-12-10 18:34:32

除了具有特定類別的輸入之外的所有輸入的樣式

回答

相關問題