酷知百科網

位置:首頁 > 遊戲數碼 > 電腦

HTML中插入背景圖的代碼是什麼

電腦2.48W

如果想在整個頁面上將一張大圖作爲背景,用代碼該怎麼實現呢

操作方法

(01)在body中創建背景圖片,就需要用到背景圖片屬性啦,如圖在background-image後面插入url;在rul後面就是添加的圖片連結位置

HTML中插入背景圖的代碼是什麼

(02)如果我們只做了這麼一步,而且自己的圖片本來就不是很大,那麼在網頁上就會出現多拍重疊的圖片,

HTML中插入背景圖的代碼是什麼 第2張

(03)這時候就需要將圖片重複現象去掉,設定代碼background-repeat設定,而這裏就有多鍾設定方式了,可以將圖片只在橫排出現

HTML中插入背景圖的代碼是什麼 第3張

(04)如圖在橫排出現重複

(05)也或者只讓他在豎排重複出現

HTML中插入背景圖的代碼是什麼 第4張
HTML中插入背景圖的代碼是什麼 第5張

(06)只讓他出現一張圖片的方法就是設定no-repeat;這樣在背景上就會顯示一張圖片了

HTML中插入背景圖的代碼是什麼 第6張
HTML中插入背景圖的代碼是什麼 第7張

(07)如果想要將這個圖片在整個背景上顯示,可以設定background-size:100%  auto;這樣就將背景只顯示一張圖片了

HTML中插入背景圖的代碼是什麼 第8張
HTML中插入背景圖的代碼是什麼 第9張

(08)在圖片背景的問題上,還可以對圖片背景進行定位處理。

HTML中插入背景圖的代碼是什麼 第10張
標籤:HTML 背景圖 代碼