Android - 奇怪的行为 html 样式最大宽度答案

【问题标题】：Android - Strange Behavior html style max-widthAndroid - 奇怪的行为 html 样式最大宽度
【发布时间】：2013-01-21 00:22:37
【问题描述】：

我想在 WebView 中显示一些 html。在该 html 代码中有一个图像标签“img src”和一个样式：style="max-width:300px;max-height:300px;"。我的智能手机的显示宽度是 480 像素。当我将最大宽度样式设置为 480 像素时，图像不适合显示器并且不完全可见。在 WebView 周围，没有 Margin 或 Padding。但是当我将最大宽度设置为 300 像素时，图像非常适合。这是什么原因？我的显示宽度为 480 像素，而该样式的图像为 300 像素。

webView.loadData(newContent, "text/html; charset=UTF-8", null);

Html 代码（新内容）：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title></title>
</head>
<body bgcolor="white" leftmargin="0" topmargin="0">
<img src="http:...jpg" style="max-width:300px;max-height:300px;" />
<p>Text Text Text</p>
</body>
</html>

【问题讨论】：

也许这篇文章对你有用css-tricks.com/snippets/css/media-queries-for-standard-devices
有一种方法可以为不同的屏幕尺寸定义高度和宽度。我会找到一种方法来动态设置该大小。问题是，我不能使用 Metrcis，因为我的智能手机或 WebView 的尺寸没有显示适合 WebView 宽度的图像。

标签： android html css image android-webview

【解决方案1】：

我已经测试了很多方法，并通过使用百分比来解决这个问题。现在，如果图像很大，则图像非常适合显示，如果图像小于显示，则保持其宽度。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title></title>
</head>
<body bgcolor="white" leftmargin="0" topmargin="0">
<img src="http:...jpg" style="max-width:100%;" />
<p>Text Text Text</p>
</body>
</html>

【讨论】：