css3 - css背景圖片高度百分百，寬度保持比例怎么做？

問題描述

css中有寬度百分百，若想達到高度占屏幕的百分百，寬度保持縱橫比應該怎么做呢， 希望詳細解答，嘻嘻

問題解答

如果你指的是背景圖的話... background-size: auto 100%; 會是你想要的效果的。

推薦看看MDN對background-size的解釋

雖然也想能夠詳細回答，但是愛莫能助啊，不知道你要什么，需要什么。

background: url(../images/main1_bg.jpg) no-repeat center center; background-size:cover; background-attachment: fixed;我以前寫的，這里的background-size：100% 100%；估計可以，但比例會失真。我現在用的辦法都是把img設置為absolute，top:0;left:50%; height:100%; 然后在標簽上寫<img ... onload='setPos(this)'>然后這個setpos函數寫在js文件里，function setpos(ts){ var w=ts.width/2; ts.style.margin='0 0 0 -'+w+'px'; } 這個函數會在圖片加載完成后執行，讓圖片水平居中。