如何在網頁的兩個不同區域（div）中更改占位符文本顏色

Question

我只想知道如何更改html頁面中占位符文本的顏色。 我用了

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

它可以工作，但是在整個頁面中更改了占位符文本的顏色。 因此，請讓我知道是否有任何方法可以指定占位符或在html中輸入內容，以便我們只能更改所需區域的占位符文本顏色。

Answer 1

試試這個代碼

 .fname::-webkit-input-placeholder { color: red } 

 <div class="content"> <input type="text" name="firstname" class="fname" placeholder="placeholder"> </div> <input type="text" name="lastname" class="lname" placeholder="placeholder"> 

或者可以使用

.content ::-webkit-input-placeholder {
  color: red
}

Answer 2

它將僅更改Chrome的占位符。 要獲取個人樣式，請嘗試以下CSS：

 .changed::-webkit-input-placeholder{ color: red; } .changed::-moz-placeholder { color: red; } .changed:-ms-input-placeholder { color: red; } 

 <input type="text" class="changed" placeholder="Changed placeholder"> <input type="text" class="original" placeholder="Original placeholder">