具有非空屬性的目標元素

Question

我想要對我的輸入字段進行樣式設置，但不知怎的，我必須檢測此輸入是否具有佔位符屬性，並且是否實際填充了。我想避免JS的東西做到這一點，所以我的問題是：有沒有任何CSS技巧，所以我可以針對這個特定的選擇器？

目前我有：

<input type="text" placeholder=""> 

input[placeholder] { 
// my styles 
} 

但無論如何這也適用風格。謝謝你的幫助。

Answer 1

您可以使用:not(）選擇像

[placeholder]:not([placeholder=""]) { 
 
    background: green; 
 
}

<input type="text" placeholder=""> 
 

 
<input type="text" placeholder="test">