怎么在css中設(shè)置圖片不重復(fù)

發(fā)布時(shí)間：2021-04-15 18:11:36 來(lái)源：億速云閱讀：267 作者：Leah 欄目：web開發(fā)

這篇文章將為大家詳細(xì)講解有關(guān)怎么在css中設(shè)置圖片不重復(fù)，文章內(nèi)容質(zhì)量較高，因此小編分享給大家做個(gè)參考，希望大家閱讀完這篇文章后對(duì)相關(guān)知識(shí)有一定的了解。

css可以使用“background-repeat”屬性設(shè)置圖片不重復(fù)，語(yǔ)法“background-repeat:no-repeat”；該屬性設(shè)置是否及如何重復(fù)背景圖像，當(dāng)值為“no-repeat”時(shí)，表示背景圖像僅顯示一次。

background-repeat 屬性介紹：

background-repeat 屬性定義了圖像的平鋪模式。

從原圖像開始重復(fù)，原圖像由 background-image 定義，并根據(jù) background-position 的值放置。

屬性值：

repeat 默認(rèn)。背景圖像將在垂直方向和水平方向重復(fù)。
repeat-x 背景圖像將在水平方向重復(fù)。
repeat-y 背景圖像將在垂直方向重復(fù)。
no-repeat 背景圖像將僅顯示一次。
inherit 規(guī)定應(yīng)該從父元素繼承 background-repeat 屬性的設(shè)置。

示例：

<html>
<head>
<style type="text/css">
body
{ 
background-image: 
url(/i/eg_bg_03.gif);

}
</style>
</head>
<body>
</body>
</html>

效果圖：

怎么在css中設(shè)置圖片不重復(fù)

css設(shè)置圖片不重復(fù)

<html>
<head>

<style type="text/css">
body
{ 
background-image: 
url(/i/eg_bg_03.gif);
background-repeat: no-repeat
}
</style>

</head>

<body>
</body>
</html>

效果圖：

怎么在css中設(shè)置圖片不重復(fù)

關(guān)于怎么在css中設(shè)置圖片不重復(fù)就分享到這里了，希望以上內(nèi)容可以對(duì)大家有一定的幫助，可以學(xué)到更多知識(shí)。如果覺得文章不錯(cuò)，可以把它分享出去讓更多的人看到。

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

怎么在css中設(shè)置圖片不重復(fù)

猜你喜歡

最新資訊

相關(guān)推薦

相關(guān)標(biāo)簽