WebView加载图片超过屏幕大小的问题

使用WebView加载一个网页,很可能会出现横向的滚动条,让界面看起来很不方便,就像打开了一个为电脑设计的网页,尽管这个网页本身只有一个div。

我发现绝大多数情况下是因为图片大小超过屏幕所引起的,因为文字是会自动换行的。

如果你没有网页设计的经验,你多半会考虑如何设置WebView。

其实这不应该由WebView解决,WebView也不好解决。

使用css就可以了

在请求的网页中添加css来限制图片的大小:

<style>
 
img{
 max-width:80%;
 height:auto;
}
 
</style>

这样每张图片的最大宽度只有设备的80%那么宽了,你可以设置成其它值。

注意,是max-width,不要这样设置:

<style>
 
img{
 width:80%;
 height:auto;
}
 
</style>

这样的话,如果是在平板上,屏幕的80%很可能比图像本身要宽的多,造成图片被拉大。