更改內部類佔位符的文本顏色

Question

我正在努力解決一個相當微不足道的問題，我從未有過使用CSS的經驗。如何更改此類佔位符文字顏色？

<div class="square"> 
    <input class="circle" placeholder="blue" /> 
</div> 

我覺得這樣的事情可能會奏效，但它沒有

.square{ 
     .circle::-webkit-input-placeholder { 
     color: blue; 
     } 
} 

另外，我想知道如何完成相同的，如果其進一步向下嵌套層次。是否可以跳過目標占位符和外部元素之間的元素？

Answer 1

要指定.square元素中的.circle元素，你想要寫：

.square .circle::-webkit-input-placeholder { 

Answer 2

你的語法更改爲下面的代碼：

.square .circle::-webkit-input-placeholder { 
 
    color: blue; 
 
}

<div class="square"> 
 
    <input class="circle" placeholder="blue" /> 
 
</div>

看起來你已經使用了SASS語法。

希望這會有所幫助！

Answer 3

嘗試this..and檢查this

::-webkit-input-placeholder { 
    color: red; 
} 

:-moz-placeholder { /* Firefox 18- */ 
    color: red; 
} 

::-moz-placeholder { /* Firefox 19+ */ 
    color: red; 
} 

:-ms-input-placeholder { 
    color: red; 
}