CSS占位符是一種特殊的CSS選擇器，它可以指定在沒有內(nèi)容或者空內(nèi)容的情況下顯示的樣式。

有時(shí)候，我們需要在用戶輸入內(nèi)容之前顯示一些提示信息，這時(shí)候就可以使用CSS占位符。

常見的應(yīng)用場景是在表單控件中，給用戶提示輸入的內(nèi)容。

input[type="text"]::-webkit-input-placeholder {
color: #999;
}
input[type="text"]::-moz-placeholder {
color: #999;
}
input[type="text"]::placeholder {
color: #999;
}

上面的代碼就是設(shè)置占位符的樣式，其中的::placeholder是CSS3新增的偽元素，可以用來指定文本框的占位符樣式。

但是有時(shí)候用戶點(diǎn)擊文本框時(shí)，占位符并沒有消失，影響用戶的輸入，這時(shí)候就需要添加以下代碼：

input[type="text"]:focus::-webkit-input-placeholder {
color: transparent;
}
input[type="text"]:focus::-moz-placeholder {
color: transparent;
}
input[type="text"]:focus::placeholder {
color: transparent;
}

上面的代碼就是設(shè)置有焦點(diǎn)時(shí)占位符的樣式，通過設(shè)置color: transparent來實(shí)現(xiàn)占位符的消失。

這樣就可以實(shí)現(xiàn)輸入內(nèi)容時(shí)占位符的消失，提高用戶的交互體驗(yàn)。