① css怎麼設置背景圖片自適應,背景不虛
把background-size設為100%即可自適應。
至於虛不虛,那就要看圖片本身的解析度了,一個很小的圖片拉大了肯定會虛的,神仙也沒辦法。
② 如何使一整張背景圖片自適應div或者table的大小
自適應?
那就把背景圖片平鋪顯示了
如果想div變大圖片也變大,用背景圖片(background-image)是做不到的
③ 網站背景圖和banner圖怎樣做成自適應css怎麼改
背景圖寬度自適應方法:
添加css樣式background-size: 100%; 它的意思是規定背景圖像的尺寸,但這個css樣式使用時需要注意,有些瀏覽器是不支持,比如IE要求9+的版本才可以支持。
banner圖自適應方法差不多,也是把圖的寬度設置為百分比,容器的寬度依照窗口大小來設為百分比:
對圖片添加寬度,因為不是背景圖,所以對img添加css:
img {
width: 100%;
}
以上,希望對你有幫助,如果我沒有說明白,可以追問。
④ table或td的background圖片怎麼自適應100%填充
若是讓圖片做一個背景進行平鋪,則可以使用,background-repeat:repeat;
若只是想讓那一張圖片被撐開,則可以使用:background-size:cover;
-webkit-background-size:cover;
-moz-background-size:cover;
但是這要注意的是,這個屬性只有高級瀏覽器才能支持。比如chrome或者firefox或者IE9以上的屬性。
⑤ css怎麼讓背景圖片自適應,背景不虛
用background-size屬性,你想給他多大的百分比都可以,不設置表示默認圖片大小,設置100%表示全屏顯示圖片,按比例縮小或者放大
⑥ css背景圖片自適應
實現代碼參考:
瀏覽器支持:
Firefox 3.6+ , Chrome 1.0+ , Opera 9.63+, IE9 +
具體寫法
<style>
.container{background-image:url(『』);background-attachment:fixed;background-repeat:no-repeat;background-size:cover;-moz-background-size:cover;-webkit-background-size:cover;}
</style>
<body>
<divclass=」container」>
</div>
</body>
⑦ css如何使background-image自動適應窗口大小
你好,如果只考慮高級瀏覽器,這個需求很好做,一句簡單的css代碼就可以搞定了:
html,
body {width: 100%;height: 100%;}
body {background-image: url(images/bg.png);background-size: cover;}其中background-size的取值:
cover:保證背景不變形填滿窗口,超出部分被裁剪
contain:保證整張背景圖片在body內部,不足區域留白
二者都能保證背景隨窗口大小變化而自適應。
另,如果是要考慮到低級瀏覽器,這個稍微麻煩點,不過可以給你提供解決方案
設置一個背景img標簽,fixed定位,填滿整個窗口
window.onresize的時候,動態計算img標簽的尺寸,同時改變定位位置
希望能解決你的問題,如有疑問歡迎追問,望採納~