::-webkit-input-placeholder { /* WebKit, Blink, Edge */ color: #909; }
此代碼更改所有輸入占位符的顏色。如何為不同的輸入欄位制作不同的占位符顏色
uj5u.com熱心網友回復：
您需要更具體：
如果您放入::-webkit-input-placeholderCSS，您將選擇所有占位符...但這不是我們想要的
所以使用:nth-of-type();偽類，你可以很容易地選擇想要的。
有用的檔案：
nth-of-typeMDN 檔案
所以代碼將是這樣的：
/* 1 */
input:nth-of-type(1)::-webkit-input-placeholder {
color: green;
}
/* 2 */
input:nth-of-type(2)::-webkit-input-placeholder {
color: blue;
}
/* 3 */
input:nth-of-type(3)::-webkit-input-placeholder {
color: red;
}<!-- 1 -->
<input type="text" name="" id="" placeholder="hello world">
<!-- 2 -->
<input type="text" name="" id="" placeholder="hello world">
<!-- 3 -->
<input type="text" name="" id="" placeholder="hello world">uj5u.com熱心網友回復：
另一種選擇是使用::placeholder到的風格placeholder。
::placeholder CSS 偽元素表示 or 元素中的占位符文本。
請注意，Internet Explorer 不支持此功能，但由于您使用的是webkit，因此您使用的是 Chrome 或 Safari，這將適合您。
例子：
::placeholder{
color:red;
opacity:0.6
}<input placeholder='yes'/>轉載請註明出處，本文鏈接：https://www.uj5u.com/caozuo/406678.html
標籤：
上一篇：強制（矩形）影像顯示為邊長=可變父div寬度的正方形
下一篇：單擊底部時如何替換div內容？