溫馨提示×
您好，登錄后才能下訂單哦！
點擊 登錄注冊 即表示同意《億速云用戶服務條款》
您好，登錄后才能下訂單哦！
小編給大家分享一下使用CSS設置背景顏色和圖像的方法是什么，希望大家閱讀完這篇文章后大所收獲，下面讓我們一起去探討吧！
使用CSS設置背景我們需要用到background背景屬性，通過background屬性我們可以設置背景顏色和背景圖像。
我們先來看看CSS設置背景顏色
我們需要使用background-color來改變背景顏色
background-color:value（顏色編碼或者顏色名稱）
在值的部分，你可以輸入諸如＃000000的顏色代碼或諸如white的顏色名稱，設置的顏色就為背景顏色。
background-color的初始值是transparent，在這種情況下，將應用父元素的背景顏色。如果父元素中沒有設置，它將變為白色。
CSS設置圖像背景
通過使用background-image屬性，我們可以預先設置上傳到服務器的圖像作為背景。
background-image: url("圖像的路徑");在url中，輸入要用作背景的圖像文件的路徑。如果css文件和圖像文件位于同一目錄中，則只有文件名就可以了。
絕對路徑和相對路徑都可以用作圖像文件的路徑。
要輸入相對路徑，請輸入外部樣式表的相對路徑，而不是html文件的相對路徑。
接著我們來看具體的示例
使用background-color設置背景顏色
代碼如下
<!DOCTYPE html>
<html>
<head>
<title></title>
<style type="text/css">
body{
background-color: skyblue;
}
</style>
</head>
<body>
<p>背景顏色設置</p>
</body>
</html>運行結果
在瀏覽器上顯示如下效果，指定的顏色skyblue被設置為背景顏色
使用background-image設置背景圖像
代碼如下
<!DOCTYPE html>
<html>
<head>
<title></title>
<style type="text/css">
body{
background-image: url("img/t.jpg");
}
</style>
</head>
<body>
<p>背景圖像設置</p>
</body>
</html>運行效果下圖所示
當屏幕尺寸大于背景圖像時，默認情況下會自動重復顯示背景圖像。可以使用background-repeat屬性更改此設置。
背景圖像顯示開始位置位于初始設置的左上角。可以使用background-position屬性更改此設置
看完了這篇文章，相信你對使用CSS設置背景顏色和圖像的方法是什么有了一定的了解，想了解更多相關知識，歡迎關注億速云行業資訊頻道，感謝各位的閱讀！
免責聲明：本站發布的內容（圖片、視頻和文字）以原創、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯系站長郵箱：is@yisu.com進行舉報，并提供相關證據，一經查實，將立刻刪除涉嫌侵權內容。
