如何設置html中的背景圖片(全屏顯示,且不拉伸)


1 <style>
2 body{background-image:url(https://uploadbeta.com/api/pictures/random/?key=BingEverydayWallpaperPicture);
3 background-size:cover;background-attachment: fixed; 4 background-repeat:no-repeat;background-position:center } </style>
👆👆👆是我用的代碼
Background : 背景色
Background Image :選取你的背景圖
Reapeat : 背景圖是否重復,其 中選no-repeat為不重復,repeat為重復,repeat-x和repeat-y分別為只在X和Y方向重復。
Attachment : 背景圖位置,fix為背景圖位置固定不變,scroll為背景圖隨頁面一同滾動
Horizontal : 為固定背景圖時圖在水平方向所居的位置,可以選擇居中,居左,居右或自己設定距左的距離。
Vertical : 為固定背景圖時圖在豎直方向所居的位置,可以選擇居中,居頂部,居底部或自己設定距頂的距離。
注意帶 * 的選項要在瀏覽器里才能看到效果。
設定完畢,對Dreamweaver左下角點選<body應用該CSS樣式就行了
不光是<body標簽,頁面里有的元素都可以在那里選擇,可以很方便的選取應用對象。
對於所有onload 的觸發事件,也都可以選<body再加Behavior,比如drag layer或打開頁面后彈出窗口等等
background-attachment屬性控制背景圖象是否隨內容一起滾動,取值為scroll和fixed。默認值為scroll(滾動);fixed為靜止。
 

 

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM