在Android上,有没有一种安全的方法可以在Chrome中获得实际正确的屏幕物理尺寸？如有必要,旧版Chrome和Android可能会被排除在范围之外.
stackoverflow上有很多关于从javascript(或css)中获取设备的实际物理屏幕尺寸的死胡同问题.似乎html api标准化与实际浏览器实现之间没有融合,更不用说浏览器实现依赖于OS api,而OS api依赖于硬件提供正确的信息.
顺便说一下,一些先前的答案是神秘的(2011年等),假设当时普遍存在一定的像素密度,因此无用.其他与webkit相关,而Chrome闪烁可能已经取代了chrome(？)中的webkit.
我想通过将事物限制在Android上的Chrome来探索简单解决方案的存在.
这完全是关于浏览器内部的javascript(或css)解决方案,而不是本机应用程序的解决方案.
我正在试图弄清楚如何利用移动视口元标记自动缩放HTML页面的内容以适应Web视图.
约束:
例如,如果我有一个图像(640x100px),我希望在webview为300x250(缩小到适合)时缩小图像.另一方面,如果webview是1280x200,我希望图像放大并填充webview(放大到适合).
在视口上阅读android文档和iOS文档之后,看起来很简单:因为我知道我的内容的宽度(640)我只是将视口宽度设置为640并让webview决定是否需要向上或向下缩放内容适合webview.
如果我将以下内容放入我的Android/iPhone浏览器或320x50 webview中,则图像不会缩小以适应宽度.我可以向右和向左滚动图像..
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Test Viewport</title>
<meta name="viewport" content="width=640" />
<style type="text/css">
html, body {
margin: 0;
padding: 0;
vertical-align: top;
}
h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,cite,code,del,dfn,em,img,q,s,samp,small,strike,strong,sub,sup,tt,var,dd,dl,dt,li,ol,ul,fieldset,form,label,legend,button,table,caption,tbody,tfoot,thead,tr,th,td
{
margin: 0;
padding: 0;
border: 0;
font-weight: normal;
font-style: normal;
font-size: 100%;
line-height: 1;
font-family: inherit;
vertical-align: top;
}
</style>
</head>
<body>
<img src="http://www.dmacktyres.com/img/head_car_tyres.jpg">
</body>
</html>
我在这做错了什么？视口元标记是否仅放大<webview区域的内容？