溫馨提示×

溫馨提示×

您好，登錄后才能下訂單哦！

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

CSS如何加背景圖片

發(fā)布時(shí)間：2022-02-22 15:52:44 來源：億速云 閱讀：289 作者：iii 欄目：開發(fā)技術(shù)

這篇文章主要介紹了CSS如何加背景圖片的相關(guān)知識，內(nèi)容詳細(xì)易懂，操作簡單快捷，具有一定借鑒價(jià)值，相信大家閱讀完這篇CSS如何加背景圖片文章都會有所收獲，下面我們一起來看看吧。

background 屬性

在學(xué)習(xí)如何添加背景圖片前，我們需要先學(xué)習(xí) background 屬性。它是專門用來設(shè)置背景色或者背景圖片的。

  • background-color:  設(shè)置背景顏色。

  • background-position:  設(shè)置背景圖像的位置。

  • background-size:  設(shè)置背景圖片的尺寸。

  • background-repeat : 設(shè)置是否重復(fù)背景圖像。

  • background-origin: 設(shè)置背景圖片的定位區(qū)域。

  • background-clip: 設(shè)置背景的繪制區(qū)域。

  • background-attachment:  設(shè)置背景圖像是否固定或者隨著頁面的其余部分滾動。

  • background-image: 設(shè)置背景圖片路徑。

其中設(shè)置背景圖片就需要用到 background-image。

background-image:url(圖片路徑)

示例如下：

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="utf-8">
	<title>CSS設(shè)置背景圖片 - 億速云(yisu.com)</title>
	<style type="text/css"> 
		body{		   background: url("./image/img1.png") no-repeat;
		}
	</style>
</head>
<body>
</body>
</html>

關(guān)于“CSS如何加背景圖片”這篇文章的內(nèi)容就介紹到這里，感謝各位的閱讀！相信大家對“CSS如何加背景圖片”知識都有一定的了解，大家如果還想學(xué)習(xí)更多知識，歡迎關(guān)注億速云行業(yè)資訊頻道。

向AI問一下細(xì)節(jié)

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

css
AI
助
手