css背景圖與html插入img的區(qū)別

1.寫在css里面的圖片是以背景圖形式存在的,而寫在html里的是以標簽形式存在的,在網頁加載的過程中,以css背景圖存在的圖片會等到結構加載完成(網頁的內容全部顯示以后)才開始加載,而html中的標簽是網頁結構(內容)的一部分會在加載結構的過程中加載。換句話講,網頁會先加載標簽的內容,再加載背景圖片,如果你用引入了一個很大的圖片,那么在這個圖片下載完成之前,之后的內容都不會顯示。而如果用css來引入同樣的圖片,網頁結構和內容加載完成之后,才開始加載背景圖片,不會影響你瀏覽網頁內容。

2.通常是非內容的圖片就寫在css里面,如果是內容性的圖片就寫在html里面,打個比方,你要做一個有漂亮邊框的相冊。那么修飾邊框的圖片就寫在css里面,相框里面的內容照片就寫在html里面。網頁設計方向是表現(xiàn)層和內容層分離,css管表現(xiàn),也就是顯示效果,html管結構,內容結構的劃分,這樣代碼要簡潔易維護一些。

3.瀏覽器讀取頁面,css背景圖和img圖片都會下載到本地緩存文件夾。至于緩存多久,每個緩存文件有個標記的,瀏覽器會判斷要不要向服務器重新發(fā)請求獲取資源。至于這個標記是怎么樣的,要看服務器上是怎么設置的。所以,css背景圖和img圖片在網頁中都可以重復使用。

4.圖片做為背景,在圖片沒加載的時候或者加載失敗的時候,不會有個圖片的占位標記,不會出現(xiàn)紅叉。

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯(lián)系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發(fā)布,文章內容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務。

推薦閱讀更多精彩內容

  • 1.寫在css里面的圖片是以背景圖形式存在的,而寫在html里的img是以標簽形式存在的,在網頁加載的過程中,以c...
    楚喬666閱讀 1,310評論 0 0
  • 問答題47 /72 常見瀏覽器兼容性問題與解決方案? 參考答案 (1)瀏覽器兼容問題一:不同瀏覽器的標簽默認的外補...
    _Yfling閱讀 13,815評論 1 92
  • Android 自定義View的各種姿勢1 Activity的顯示之ViewRootImpl詳解 Activity...
    passiontim閱讀 173,560評論 25 708
  • 目標:種出理想的伴侶 感恩冥想: 1、感恩今天早上醒來媽媽給我做的早飯,媽媽知道我牙疼專門做了面條給我吃,謝謝媽媽...
    小兔兔姐姐愛吃胡蘿卜閱讀 87評論 0 0
  • 一瞬的回眸,掀動心的顫抖。 轉臉的溫柔,留住我的心房。 曾幾時,久久凝視,以心相許。 曾幾時,心心相通,沐浴愛河。...
    古月琳琳閱讀 286評論 0 1