CSS控制背景

1.背景 background:顏色 圖片 平鋪方式 固定方式 位置

2.背景顏色 background-color:#ccc;

3.背景圖片 background-p_w_picpath:url(背景圖像的位置及全稱)

4.背景圖像的平鋪方式 background-repeat:repeat/no-repeat/repeat-x/repeat-y

5.背景圖像的位置 background-position:top/center/bottom left/center/right

? ?x y //第一個值是水平位置，第二個值是垂直位置。左上角是0 0.單位是像素(0px 0px)

6.背景圖片的依附方式 background-p_w_upload:scroll/fixed

注意：背景圖片的依附方式中的值fixed在IE6中不支持。

? ? ? 解決方法是IE6中HTML和BODY兩個元素支持fixed這個值，

? ? ? 所以要在IE6中讓圖片在屏幕某個位置不動，就得在HTML或BODY中設置background-p_w_upload:fixed;

background-position的兩種設置方式：

background-position:center center;

background-position:100px 100px;

-------------------------------

css精靈

制作翻轉按鈕效果的兩種方法：

1.我們需要兩張圖片，一張正常狀態的圖片，一張鼠標經過時的圖片，

? 這種按鈕思路就是，設置鏈接a的背景為第一張圖片，a:hover的背景為第二張背景圖片

2.將兩張圖片合成一張圖片，將這張在圖片設置成背景，

? 然后將a:hover的背景向上移動相應的像素即可。background-position

css精靈是用來優化網頁的，因為可以減少http請求次數，提高網頁效率。

css精靈的核心思想，就是將多張圖片，合成一張圖片，

然后通過背景屬性中的定位來控制到底顯示圖片中的哪些部分。

轉載于:https://blog.51cto.com/1154179272/1657210

總結

以上是生活随笔為你收集整理的10_css控制背景与css精灵.txt的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。