CSS 輸入框固定文字是指在輸入框內部固定一些提示性的文字，以便提醒用戶輸入內容的格式、范圍等信息。下面我們將介紹如何使用 CSS 實現輸入框固定文字的效果。

/* 輸入框樣式 */
input[type="text"], input[type="password"], textarea {
position: relative;
}
/* 固定文字樣式 */
label {
display: block;
position: absolute;
top: 12px;
left: 12px;
color: #999;
font-size: 12px;
}
/* 輸入框 hover 時隱藏固定文字 */
input:hover + label,
textarea:hover + label {
visibility: hidden;
}
/* 輸入框 focus 時隱藏固定文字 */
input:focus + label,
textarea:focus + label {
visibility: hidden;
}
/* 輸入框有文字時隱藏固定文字 */
input:not(:placeholder-shown) + label,
textarea:not(:placeholder-shown) + label {
visibility: hidden;
}

以上代碼中，我們首先對輸入框和固定文字分別設置了樣式。對于輸入框，我們需要將其 position 屬性設置為 relative，這樣才能使其內部的其他元素相對于其進行定位。對于固定文字，我們通過 position: absolute 定位到輸入框內部的合適位置。

接下來，我們設置了輸入框 hover、focus、有文字時的固定文字隱藏效果。其中， :placeholder-shown 是一個偽類，它可以匹配到輸入框是否有 placeholder 屬性，并且是否顯示 placeholder 的值。所以當輸入框有文字（即 :placeholder-shown 為 false）時，我們可以將固定文字隱藏掉。

經過這些處理，我們就可以以較小的成本實現一個輸入框固定文字的效果了。