視口不工作了

我做了一個非常簡單的網站www.abasi.info/viewport視口不工作了

下設出來的：

<!DOCTYPE html> 

<html> 
<head> 

<meta name="viewport" content="width=device-width, initial-scale=1"> 

</head> 
<body> 

<p><img alt="18" src="18.gif" style="height:55px; width:550px;"></p> 



</body> 
</html>

的數字應該去，直到18但是，隨着我的Android手機（版2.3.6）視口不調整。它放大了很多。我只在網站上有這張照片（沒有別的）。如果上述視口可以工作，它會在圖片中顯示所有數字直到18個。這很奇怪。

來源

2014-09-28 Janik.cc

你添加@media所有（）{}在CSS styleheet – 2014-09-28 13:36:35

使其更加要添加'最大寬度：100％;'.. – Luke 2014-09-28 13:42:55

@Vitorino上面這段代碼就是我添加的所有內容，並且應該使網站與設備一起使用，而不是將其切斷，對吧？ – 2014-09-28 13:58:39

您需要製作圖像100％寬度和自動高度，因此比例不會混亂。

例子 -

img{ 
    width:100%; 
    height:auto; 
}

http://jsfiddle.net/1n9jnaxw/

你也可以使用最大寬度，但一定要首先定義圖像尺寸。

視口限制到550px，你將不得不改變它TO-

<meta name="viewport" content="width=550, maximum-scale=1, user-scalable=no">

來源

2014-09-28 13:47:28 Artipixel

但我希望視口適應網站的寬度。網站的寬度是550px，所以我希望網站的寬度是550px。 – 2014-09-28 13:49:05

更新我的評論 – Artipixel 2014-09-28 13:52:24

關於最新編輯：對不起，我不想在最後一個固定的視口。我想要一個流利的。我提交了示例來說明width = device-width不起作用。 – 2014-09-28 13:56:56

視口不工作了

回答

相關問題