Android WebView 显示富文本图片显示过大

1.接口返回中的图片,在webView 中显示的图片宽度不一样,webView 中显示的图片要比实际图片大很多 

doc = Jsoup.parse(htmlStr);

        //修改视频标签
        Elements embeds = doc.getElementsByTag("embed");
        for (Element element : embeds) {
            //宽度填充手机,高度自适应
            element.attr("width", "100%").attr("height", "auto");
        }
        //webview 无法正确识别 embed 为视频,所以这里把这个标签改成 video 手机就可以识别了
        doc.select("embed").tagName("video");

        //控制图片的大小
        imgs = doc.getElementsByTag("img");

        for (int i = 0; i < imgs.size(); i++) {
            //imgs.get(i).attr("max-width", "100%").attr("height", "auto");
            imgs.get(i).attr("style", "max-width: 100%; height: auto;");
        }

        webView.loadDataWithBaseURL(null, doc.toString(), "text/html", "UTF-8", null);

2.同时设置了width和max-width两个属性,则以下面规则显示宽度

     (1)当width元素小于max-width时,元素宽度以width为准

     (2)、若超过max-width则以max-width为准。

     例

    (1)、若width100px; max-width:400px;则宽度为100px;

     (2)、若width:500px;max-width:400px,则宽度为400px;

      当然若width和max-width同为px或者rem等固定单位,则没有必要同时设置两个属性。

     (3)、若width:100%;max-width:900px;  则含义为宽度为元素为父元素宽度的100%,但最大宽度不超过900px
 

你可能感兴趣的:(android,android,webview)