如何使移动网页不缩水？

当您访问手机上的网页（我正在使用Android）时，如果它是常规网页，它会将其缩小以适合您的手机屏幕。如何使移动网页不缩水？

我一直认为让手机页面变得足够小，足以完全适应手机的屏幕分辨率而不缩小。

虽然没有发生这种情况。我甚至专门将我的页面尺寸设置为body{ width: 300px;}，当我将其加载到手机中时，它的左上角收缩了很多，并且周围有很多可用空间。

我在做什么错？

2011-08-16 JD Isaacks

之前我已经回答了这个问题：http://stackoverflow.com/questions/2977550/iphone-safari- css-rotation-bug/3188736＃3188736 –

您需要使用视meta标签

<!doctype html> 
<html> 
<head> 
    <title>Hello world!</title> 

    <meta name="viewport" content="width=device-width"/> 
</head> 

<body> 

<p>Hello world!</p> 

</body> 
</html>

阅读在这里详细http://davidbcalhoun.com/2010/viewport-metatag

来源

2011-08-16 13:14:22

谢谢修复它！ :) –

很好的答案，但仍然不显示网页的实际大小。网页上的1个像素实际上是移动屏幕上的1.5像素。 – trusktr

这是因为身体的宽度与浏览设备有关。

大多数现代手机都模拟桌面浏览器，因此相对于整个浏览器窗口，300px的宽度为300px。基本上，您将在您的桌面浏览器中看到与您在手机浏览器中相同的内容。

理想情况下，要做的事情是显示与移动用户略有不同的内容。通常是具有较大菜单项的页面的减少版本，并隐藏了许多不必要的常见内容。（花式头等）。

来源

2011-08-16 13:13:20

如何使移动网页不缩水？

回答

相关问题