小編給大家分享一下css如何設(shè)置背景圖片位置，希望大家閱讀完這篇文章之后都有所收獲，下面讓我們一起去探討吧！

成都創(chuàng)新互聯(lián)專注于企業(yè)網(wǎng)絡(luò)營(yíng)銷(xiāo)推廣、網(wǎng)站重做改版、濱湖網(wǎng)站定制設(shè)計(jì)、自適應(yīng)品牌網(wǎng)站建設(shè)、H5技術(shù)、商城開(kāi)發(fā)、集團(tuán)公司官網(wǎng)建設(shè)、成都外貿(mào)網(wǎng)站建設(shè)、高端網(wǎng)站制作、響應(yīng)式網(wǎng)頁(yè)設(shè)計(jì)等建站業(yè)務(wù)，價(jià)格優(yōu)惠性價(jià)比高，為濱湖等各大城市提供網(wǎng)站開(kāi)發(fā)制作服務(wù)。

什么是css

css是一種用來(lái)表現(xiàn)HTML或XML等文件樣式的計(jì)算機(jī)語(yǔ)言，主要是用來(lái)設(shè)計(jì)網(wǎng)頁(yè)的樣式，使網(wǎng)頁(yè)更加美化。它也是一種定義樣式結(jié)構(gòu)如字體、顏色、位置等的語(yǔ)言，并且css樣式可以直接存儲(chǔ)于HTML網(wǎng)頁(yè)或者單獨(dú)的樣式單文件中，而樣式規(guī)則的優(yōu)先級(jí)由css根據(jù)這個(gè)層次結(jié)構(gòu)決定，從而實(shí)現(xiàn)級(jí)聯(lián)效果，發(fā)展至今，css不僅能裝飾網(wǎng)頁(yè)，也可以配合各種腳本對(duì)于網(wǎng)頁(yè)進(jìn)行格式化。

css設(shè)置背景圖片位置的方法：首先創(chuàng)建一個(gè)HTML示例文件；然后在body中創(chuàng)建一個(gè)div；最后通過(guò)“background: url('/i/eg_bg_03.gif')no-repeat left bottom;}”設(shè)置背景圖片位置即可。

本文操作環(huán)境：windows7系統(tǒng)、HTML5&&CSS3版、Dell G3電腦。

css如何設(shè)置背景圖片位置？

在使用背景圖片時(shí)，經(jīng)常會(huì)遇到背景圖片所在的位置不是我們想要的，那如何設(shè)置背景圖片的位置呢？下面我們來(lái)看一下css設(shè)置背景圖片位置的方法。

在背景圖片的背景圖片位置屬性中，background-position是用來(lái)控制元素背景圖片的位置。它接受三種值：

關(guān)鍵詞:如top、right、bottom、left、center

長(zhǎng)度值；如px、em、rem等

百分值：%

background-position 屬性設(shè)置背景圖像的起始位置。

這個(gè)屬性設(shè)置背景原圖像（由 background-image 定義）的位置，背景圖像如果要重復(fù)，將從這一點(diǎn)開(kāi)始。

示例：

div{width: 200px;height: 200px;
border:1px solid #ccc;
background: url('/i/eg_bg_03.gif') no-repeat left bottom;}

效果如下：

background-position 屬性的屬性值：

其中部分屬性值的含義如下所述：

top: 背景圖片的初始位置為元素頂部

center: 背景圖片的起始位置為元素中部

left: 背景圖片的起始位置為元素左側(cè)

right: 背景圖片的起始位置為元素右側(cè)

bottom: 背景圖片的起始位置為元素底部

看完了這篇文章，相信你對(duì)“css如何設(shè)置背景圖片位置”有了一定的了解，如果想了解更多相關(guān)知識(shí)，歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道，感謝各位的閱讀！