對于圖片，首先我們先想到是背景圖片。因為我們許許多的裝飾都是用背景圖片來實現(xiàn)的。既然這樣，那么就從CSS控制背景圖片講起吧。

定義和用法

background-image 屬性為元素設(shè)置背景圖像。

元素的背景占據(jù)了元素的全部尺寸，包括內(nèi)邊距和邊框，但不包括外邊距。

默認(rèn)地，背景圖像位于元素的左上角，并在水平和垂直方向上重復(fù)。

1.CSS控制背景圖片：

    對于一個網(wǎng)頁，我們開始設(shè)計的時候，可能沒有過多的去想背景圖到底是什么，因為大多都是設(shè)計背景色就可以了，原因嗎，我想也很簡單，因為它與前景音樂一樣，對于網(wǎng)頁的打開，速度會有一定的影響。不過對于一般的個人網(wǎng)站，或者個人博客而言，它對展現(xiàn)自己的個性，當(dāng)然是不可或缺的了，當(dāng)然什么都不會太過完美，有好就有壞，也就是當(dāng)圖像不可用但CSS可用的時候，替換內(nèi)容就不會顯示出來，因此，并不建議在導(dǎo)航按鈕文本或類似的情況中使用CSS背景圖片。
    控制背景圖片的CSS屬性有很多，只要與圖片的相關(guān)的，大多都會用的上。

(1)、背景圖片的導(dǎo)入：

    當(dāng)然大家最熟悉的當(dāng)然是background與background-image了。
   為網(wǎng)頁設(shè)計背景圖片的代碼是：

body {background:url("d:/images/04.jpg")}

或者

body {background-image:url("d:/images/04.jpg")}
    這樣的話，我們就能將想要作背景的圖片導(dǎo)進(jìn)網(wǎng)頁里了。

(2)、背景圖片的顯示方式：
    當(dāng)然，只用上面的代碼，是無法表達(dá)出自己想要的效果的。因為，圖片小了，就會以平鋪的方式，如果是大了，為顯示它，就是會出現(xiàn)滾動條，這樣多不好。因此，我們還得多其進(jìn)行顯示控制，也就是要用到background-repeat，

它是取值：

repeat :      默認(rèn)值。背景圖像在縱向和橫向上平鋪
no-repeat :   背景圖像不平鋪
repeat-x :    背景圖像僅在橫向上平鋪
repeat-y :    背景圖像僅在縱向上平鋪

而代碼，我想只要懂一點CSS的都知道，如下
：
body {background:url("d:/images/04.jpg");background-repeat:no-repeat}
    這樣的話，它就是以原圖像大小顯示了。

(3)、背景圖片的大小控制：

    不過問題是，倘若圖片過大了，又怎么辦呢？對于一個好網(wǎng)頁來說，最好不要用太大的圖片，原因上面也說過了，影響打開網(wǎng)頁的速度。我們最好還是用PS或者FireWorks處理一下。不過既然我提到了，我們也不防用CSS來實現(xiàn)圖片大小的控制。
    我想很多人會自然而然的用上如下代碼：

發(fā)表評論 共有條評論 用戶名: 密碼: 驗證碼: 匿名發(fā)表