對于一個網頁而言,為了更好地交互和用戶體驗,我們常常會在表單中使用默認值來提示用戶輸入內容的規范性和正確性。那么在 CSS 中,該如何設置默認文本呢?下面就來具體介紹。
CSS 中設置默認文本的方式一般就是通過設置 input[type=text]、textarea 等元素的 color、font-style、font-size 等樣式屬性。具體示例如下:
input[type=text], textarea { color: #999; /* 指定默認文本的顏色 */ font-style: italic; /* 文本傾斜 */ font-size: 14px; /* 默認字體大小 */ } input[type=text]:focus, textarea:focus { color: #333; /* 輸入文本的顏色 */ font-style: normal; /* 取消文本傾斜 */ }
上述代碼的作用就是當用戶未輸入文本時,input[type=text]、textarea 等元素的文本顏色為 #999,字體傾斜,字體大小為 14px,這就是默認文本。當文本框被點擊后,文本顏色變為 #333,字體傾斜效果消失。通過這種方式設置默認文本,可以大大提升用戶填寫表單的體驗。
下一篇css設置繁字體