如何讓我的簡單網站移動設備友好？

-2

我有一個簡單的網頁，只有一個完整大小的圖像背景。我該怎麼做才能使其移動友好？ CSS的是這樣的：如何讓我的簡單網站移動設備友好？

html{ 
    background: url(images/grindif1.jpg) 50% no-repeat; 
    background-position: center center; 
    background-repeat: no-repeat; 
    background-attachment: fixed; 
    background-size: cover; 
    background-color: green; 
    min-height:100%; 
    background-size:cover; 
}

來源

2016-04-20 Rikard Abrahamsson

你在想什麼？ –

我沒有看到任何移動不友善的地方。你有特定的問題嗎？ – mplungjan

這看起來很正常！什麼不是你想要的？ – DanyCode

首先，就像Dany Code說的那樣，不要把背景圖像放在「html」標籤上，而是放在身上。

如果你不喜歡background-size的結果：cover;在視口大小的某個斷點處，您總是可以爲這些特定媒體查詢制定不同的CSS規則。你可以使用「@media屏幕和（最大寬度：480px）{你的css代碼在這裏爲iphone特定的}}如果你想在手機上的圖像，出現一個不同的，然後他們出現在桌面上，「

來源

2016-04-20 22:42:27 Ebelanger

好吧，你在尋找這樣的財產以後？

順便說盡量把對html沒有在你的CSS，如果再使用body並把margin:0px;

body{ 
 
\t margin: 0px; 
 
    background: url(http://lorempixel.com/800/600) 50% no-repeat; 
 
    background-position: center center; 
 
    background-repeat: no-repeat; 
 
    background-attachment: fixed; 
 
    background-size: contain; 
 
    background-color: green; 
 
    height:100vh; 
 
}

<body> 
 

 

 
</body>

來源

2016-04-20 21:33:43 DanyCode

的問題是非常不清楚，但既然你問了移動兼容性我建議bootstrap

Bootstrap有類的移動&桌面網站和它易於使用。它遵循網格系統。而有不同的類來支持不同的視口：

COL-XS-〜超小型設備
COL-SM-〜小型設備
COL-MD-〜中型設備
COL-LG- 〜大型設備

來源

2016-04-20 21:36:42

如何讓我的簡單網站移動設備友好？

回答

相關問題