CSS文本框是一種常見的網頁元素,它可以為用戶提供一個輸入或編輯文本的區域。
<textarea></textarea>
文本框的樣式可以通過CSS進行自定義。以下是一些常見的CSS屬性,可以用來調整文本框的樣式:
textarea { width: 100%; height: 200px; border: 1px solid #ccc; border-radius: 5px; padding: 10px; font-size: 16px; line-height: 1.5; }
width
屬性設置文本框的寬度,height
屬性設置文本框的高度。border
屬性可以設置文本框的邊框樣式,border-radius
可以設置邊框圓角。padding
屬性可以設置文本框內部的間距,font-size
設置文本字體大小,line-height
設置文本行高。
除了以上常見的CSS屬性,還可以使用偽元素來添加額外的文本框裝飾,例如添加下劃線:
textarea:focus:before { content: ""; border-bottom: 2px solid #ddd; position: absolute; left: 0; bottom: 0; width: 100%; }
以上代碼中,我們使用了偽元素:before
來給文本框添加裝飾。當文本框獲得焦點時,就會顯示下劃線。
通過CSS自定義文本框樣式可以讓網頁更加美觀和易用,但需要注意不要過度使用,以免影響頁面性能和用戶體驗。
上一篇css文字覆蓋動畫效果
下一篇php 使用C