如何在不破坏字体大小的情况下使桌面和移动设备上的网页可读?

Kev*_*son 3 html css mobile

我希望能够以可用于桌面和移动设备的方式格式化我的博客,而无需尝试检测移动浏览器.作为网络标准的粉丝,我认为如果我只使用基本的HTML而没有任何样式,那么它应该是可用的,但事实证明iPhone和Android浏览器都使用微小的文本进行渲染(显然要复制布局)在桌面浏览器上看到).

我知道我可以使用媒体查询和其他十几种技术来获得我想要的移动浏览器外观.我很想知道是否有办法让移动浏览器以设备默认字体大小显示某些内容而不使用font-size:20pt; 在样式表中.有没有"是的,这只是简单的HTML,所以不要试图假装你有桌面浏览器的宽度"?

ick*_*fay 7

viewport meta确实为移动设备带来了奇迹.这将使视口成为设备的大小,而不是试图使其更大并缩小它:

<meta name="viewport" content="initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
Run Code Online (Sandbox Code Playgroud)

您可能会看到width=device-width此类的其他版本.这将有效,但它也将在横向模式(我认为不合适)时扩展您的网页.使用所有这些缩放约束将确保视口适合两个方向的大小.

创建它的 Apple viewport meta关于它的文档.