操作方法 - 更改佔位符顏色
瞭解如何使用 CSS 更改佔位符屬性的顏色。
佔位符顏色
自己動手試一試 »步驟 1) 新增 HTML
使用 input 元素並新增 placeholder 屬性
示例
<input type="text" placeholder="紅色佔位符文字..">
步驟 2) 新增 CSS
在大多數瀏覽器中,佔位符文字是灰色的。要更改此顏色,請使用 ::placeholder
選擇器設定佔位符樣式。請注意,Firefox 會降低佔位符的不透明度,因此我們使用 opacity: 1
來解決此問題。
示例
::placeholder {
color: red;
opacity: 1; /* Firefox */
}
::-ms-input-placeholder { /* Edge 12 -18 */
color: red;
}
自己動手試一試 »
提示:在我們的 CSS 參考手冊中閱讀更多關於 ::placeholder 選擇器的資訊:CSS ::placeholder 選擇器。