web前端入門到實戰：Css背景定位

同一個標籤能夠同時設置背景顏色和背景圖片，若是顏色和圖片同時存在，那麼圖片會覆蓋顏色。

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

2.格式：background-position:值1 值2；

值1的取值範圍：left center right

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

值2的取值範圍：top center bottom

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

值1和值2也能夠設置像素值，來分別表示距離最左邊和最上邊的像素值(注意能夠接受負值，也就是左上角就是座標的原點，圖片的左上角就是座標值的大小)，記住必定要帶單位。默認值爲：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>
專門創建的學習Q-q-u-n ⑦⑧④-⑦⑧③-零①②  分享學習方法和須要注意的小細節，互相交流學習，不停更新最新的教程和學習技巧（從零基礎開始到WEB前端項目實戰教程，學習工具，全棧開發學習路線以及規劃）

3.使用方式：

咱們使用背景圖片，而不是使用img標籤，這是由於，當咱們使用img標籤的時候，若是圖片很大那麼下面就會有滾動條，可是這種網頁是很垃圾的，由於展現出來首頁，就是讓你們看的，加一個滾動條很不舒服。那咱們用小圖片不就得了，這其實也不行，由於咱們每一個人的屏幕分辨率大小都不一樣，所以須要一張較大的背景圖片來解決上面的問題。