css中與的差別

background-image是背景圖片，是css的一個樣式

    < img / >是個區塊級元素，它是一個圖片，是html的標籤

    background-image是只能看的

     < img / >是可以操作的。例如更換img src的路徑可以達到更換圖片的目的，也可以移動它的位置，從document中移除等等動作

    background是CSS3的樣式

    img 是HTML的標籤，兩者之間存在本質的差異

    background-image存在於大的background中，其屬性#設定多種多樣，變換較為豐富

    img 上能寫字，能增加其餘想增加的元素

    一般來說，如果是裝飾性的圖片就使用background-img，如果和文體內容很相關就使用img

    在網頁載入的過程中，以css背景圖存在的圖片background-image會等到結構加載完成（網頁的內容全部顯示以後）才開始加載，而html中的標籤img是網頁結構（內容）的一部分會在加載結構的過程中加載，換句話說，網頁會先加載標籤img的內容，再加載背景圖片background-image，如果你用引入了一個很大的圖片，那麼在這張圖片下載完成前，img後面的內容都不會顯示。而如果用css來引入同樣的圖片，網頁結構和內容載入完成之後，才開始載入背景圖片，不會影響瀏覽網頁內容。

是這樣的，像極端的情況例如整個頁面的背景，我會毫不猶豫的使用background-image，但是某一個單獨的圖片，例如logo，只要加載出來就行，也不需要對它做什麼複雜的操作，我的理解是能在html裡實現的就不要再去CSS裡寫了，越簡單越好。但看到一段程式碼所有的圖片都是用div背景圖片寫的，我突然困惑了這樣到底是對是錯？能否有人跟我講一下優劣？例如載入方面有差別？ SEO差別？多謝啦！

簡單來說，img是內容部分的東西，background-image是修飾性的東西。

稍微加點文字就是

img

從頁面元素來說，如果是頁面中的圖片是作為內容出現的，例如廣告圖片，例如產品圖片，那麼這必然是用img了，因為這個是頁面元素內容。頁面元素內容最關鍵的一點就是，當頁面沒有樣式的時候，還是能一眼看過去就知道什麼是什麼…

background-image

背景圖片，修飾性的內容，在頁面中可有可無。有，是為了讓頁面中視覺感受上更美；無，不影響使用者瀏覽網頁取得內容。

其實說穿了，背景圖片就是透過樣式載入後，讓頁面更漂亮而已，內容圖片就是為了展示給使用者看的。假設有一天你的網頁沒有任何樣式的時候，那麼這時候請想想你的網站上哪些圖片是給使用者看的，這樣就夠了。

前景圖img是資料性的東西，屬於頁面要展現的內容。
背景圖是修飾性的東西，不要也罷。

例如，使用者影像，肯定是前景圖了；產品清單的圖片，也是前景圖了。 但是產品清單的圖片，有的左上方有個推薦的標籤，減價的標籤，一定就是修飾咯。

以上是css中與的差別的詳細內容。更多資訊請關注PHP中文網其他相關文章！