如何通過CSS實現背景圖片自動平鋪或拉伸至整個屏幕(自適應大小)


默認情況下,通過HTML代碼的BODY標簽設置好背景圖片<body background="x.jpg"> 后,圖片會自動橫向和縱向平鋪。這就會產生一些美觀上的問題。 XP人提供CSS代碼如下,放在頁面頭部即可,僅供參考: <style type="text/css"> body { background:url(/img/background.png); background-repeat: repeat-x; background-positon: 100%,100%;} < /style>

續: 有幾位朋友說我的這篇文章實在沒能解決他們的問題,他們希望的是不考慮自己背景圖片的大小,不管多大的屏幕,自己的背景圖片自動上下拉伸自己,適應屏幕大小,鋪滿整個屏幕。所以,我今天再把下面的代碼和大家分享。要想實現這樣的效果,可以考慮使用濾鏡。 <style type="text/css"> body{ filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/skin/v2011/images/body.png',sizingMethod='scale'); background-repeat: no-repeat; background-positon: 100%, 100%; } < /style>


免責聲明!

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



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