溫馨提示×

溫馨提示×

您好,登錄后才能下訂單哦!

密碼登錄×
登錄注冊×
其他方式登錄
點擊 登錄注冊 即表示同意《億速云用戶服務(wù)條款》

Css怎么設(shè)置背景顏色和背景圖片

發(fā)布時間:2020-06-04 17:12:35 來源:億速云 閱讀:274 作者:Leah 欄目:web開發(fā)

Css怎么設(shè)置背景顏色和背景圖片?這篇文章運用了實例代碼展示,代碼非常詳細,可供感興趣的小伙伴們參考借鑒,希望對大家有所幫助。

1.在CSS中有一個叫做background-position:屬性,就是專門用來控制背景圖片的位置

2.格式:background-position:值1  值2;

值1的取值范圍:left     center     right

值1代表背景圖片的水平位置

值2的取值范圍:top     center    bottom

值2代表背景圖片的垂直位置

值1和值2也可以設(shè)置像素值,來分別表示距離最左邊和最上邊的像素值(注意可以接受負值,也就是左上角就是坐標的原點,圖片的左上角就是坐標值的大小),記住一定要帶單位。默認值為:left    top

例子:

<style>
        .box{
            height: 1000px;
            width: 1000px;
            background-image: url("image/snow.jpg");
            background-repeat: no-repeat;
            background-position: center center;
        }
</style>

<div class="box">
</div>
專門建立的學(xué)習(xí)Q-q-u-n ⑦⑧④-⑦⑧③-零①②  分享學(xué)習(xí)方法和需要注意的小細節(jié),互相交流學(xué)習(xí),不停更新最新的教程和學(xué)習(xí)技巧(從零基礎(chǔ)開始到WEB前端項目實戰(zhàn)教程,學(xué)習(xí)工具,全棧開發(fā)學(xué)習(xí)路線以及規(guī)劃)

3.使用方式:

我們使用背景圖片,而不是使用img標簽,這是因為,當(dāng)我們使用img標簽的時候,如果圖片很大那么下面就會有滾動條,但是這種網(wǎng)頁是很垃圾的,因為展示出來首頁,就是讓大家看的,加一個滾動條很不舒服。那我們用小圖片不就得了,這其實也不行,因為我們每個人的屏幕分辨率大小都不同,因此需要一張較大的背景圖片來解決上面的問題。

上文描述的就是Css設(shè)置背景顏色和背景圖片的方法,具體使用情況還需要大家自己動手實驗使用過才能領(lǐng)會。如果想了解更多相關(guān)內(nèi)容,歡迎關(guān)注億速云行業(yè)資訊頻道!

向AI問一下細節(jié)

免責(zé)聲明:本站發(fā)布的內(nèi)容(圖片、視頻和文字)以原創(chuàng)、轉(zhuǎn)載和分享為主,文章觀點不代表本網(wǎng)站立場,如果涉及侵權(quán)請聯(lián)系站長郵箱:is@yisu.com進行舉報,并提供相關(guān)證據(jù),一經(jīng)查實,將立刻刪除涉嫌侵權(quán)內(nèi)容。

AI