background 屬性的作用是給元素設置背景,它是一個復合屬性,常用的子屬性如下:
•background-color 指定元素的背景顏色。
•background-image 指定元素的背景圖像。
•background-position 指定背景圖像的位置,在復合屬性中與 size 二選一。
•background-size 指定背景圖片的尺寸,在復合屬性中與 position 二選一。
•background-repeat 指定如何重復背景圖像。
多數時候,我們都是給 div 等區塊元素設置背景,其實還可以通過 background 屬性來給文本框設置背景色和背景圖片。呈現效果如下:

實現代碼如下:
<!DOCTYPE html><html><head> <meta charset="UTF-8"> <title>background 設置文本框背景圖</title> <style> .search { width: 600px; height: 40px; padding: 5px; border: 1px solid #666666; background-color: #FAF9DE; background-image: url(images/search.png); background-position: center right; background-size: 50px 50px; background-repeat: no-repeat; } .remark { width: 600px; height: 200px; padding: 5px; margin-top: 10px; border: 1px solid #666666; background: url(images/belle.jpg) center center no-repeat; } </style></head><body> <input class="search" type="text" placeholder="請輸入查詢關鍵詞"><br> <textarea class="remark" placeholder="請填寫備注信息"></textarea></body></html>更多 background 屬性的知識可參考:
•CSS background 屬性
•CSS background 屬性
總結
以上所述是小編給大家介紹的css 中background 設置文本框背景圖 的方法,希望對大家有所幫助,如果大家有任何疑問請給我留言,小編會及時回復大家的。在此也非常感謝大家對武林網網站的支持!如果你覺得本文對你有幫助,歡迎轉載,煩請注明出處,謝謝!
新聞熱點
疑難解答