背景圖像縮放

Question

我有一個問題，幾乎我想要做的是讓我的背景圖像保持錨定並保持相同的大小和位置，不管用戶分辨率有多大。

我現在擁有的一切：

#navigator { 
    background-image: url('banner.png'); 
    background-repeat:no-repeat; 
    background-position:top-center; 

}提前

謝謝！

Answer 1

你的意思是background-size？

#navigator { 
    background-image: url('banner.png'); 
    background-repeat:no-repeat; 
    background-position:top-center; 
    background-size: 200pt 300pt; 
} 

（從http://www.w3schools.com/cssref/css3_pr_background-size.asp）

它將爲兼容CSS3最現代的瀏覽器。

Answer 2

您將需要了解元視口選項。我一直使用的是target-densitydpi，這是Android特有的。 <meta name="viewport" content="target-densitydpi=device-dpi" />

Answer 3

試試這個，它爲我工作，

html, body, <or your div> 
{ 
    background-image:url("fdkljg.kdf"); 
    background-size:100%; 
    background-repeat:no-repeat; 
    top:0px; 
    left:0px; 
    right:0px; 
} 

，如果還是不行，請嘗試「背景位置」屬性中心或離開。 並且一旦完成了代碼，請嘗試縮放網頁以模擬屏幕分辨率。