Question

我正在将html页面加载到Web视图中，html页面将GRAY作为背景颜色，Web视图具有背景图像。当我将html页面加载到Web视图中时，我希望图像在html背景透明的情况下可见。如何使GRAY颜色变为透明，以便图像可见。

请参阅下面我的html页面代码并帮助我

 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org >
 <html xmlns="http://www.w3.org/1999/xhtml">
 <head>
<title>html page</title>

<style type="text/css">
    .show
    {
        display: inline;
    }
    .hide
    {
        display: none;
    }
    body.class
    {
        background: #444;
        font-family: Helvetica, sans-serif, Verdana, Arial;
        opacity:0.4;
        color: #FFF;
        margin: 30px 30px 0px 30px;
        width: auto;
    }
    h1
    {
        font-size: 18px;
        font-weight: normal;
        margin: 25px 0px 10px 0px;
    }
    h2
    {
        font-size: 36px;
        margin: 15px 0px 10px 0px;
        font-weight: normal;
    }
    .author-pic
    {
        width: 200px;
        height: 200px;
        margin: 0px 0px 0px 0px;
    }
    p
    {
        line-height: 17px;
    }
</style>
<script language="javascript" type="text/javascript">
    $(function ()
</script>

Answer 1

您只需查看下面的简单代码，您就会知道如何在各个浏览器的类中插入值

 body.class {
    /* Required for IE 5, 6, 7 */
    /* ...or something to trigger hasLayout, like zoom: 1; */
    width: 100%; 

    /* Theoretically for IE 8 & 9 (more valid) */   
    /* ...but not required as filter works too */
    /* should come BEFORE filter */
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";

    /* This works in IE 8 & 9 too */
    /* ... but also 5, 6, 7 */
    filter: alpha(opacity=50);

    /* Older than Firefox 0.9 */
    -moz-opacity:0.5;

    /* Safari 1.x (pre WebKit!) */
    -khtml-opacity: 0.5;

    /* Modern!
    /* Firefox 0.9+, Safari 2?, Chrome any?
    /* Opera 9+, IE 9+ */
    opacity: 0.5;
}

Answer 2

您可能需要在收到HTML时更改HTML，此示例使用JSoup（主要是因为我在Downloaded-files文件夹中有它）。

public class SomeSortOfActivityNameGoesHere extends Activity {
    static final int TIMEOUT = 30000;
    WebView mView;
    AsyncTask<String, Void, String[]> mLoad;
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        mView = new WebView(this);
        mView.setBackgroundColor(Color.TRANSPARENT);
        LinearLayout layout = new LinearLayout(this);
        layout.addView(mView, new LinearLayout.LayoutParams(LayoutParams.FILL_PARENT, LayoutParams.FILL_PARENT));
        layout.setBackgroundColor(Color.RED);
        setContentView(layout);
        mLoad = new AsyncTask<String, Void, String[]>() {
            @Override
            protected String[] doInBackground(String... params) {
                try {
                    Document doc = Jsoup.parse(new URL("http://www.stackoverflow.com"), TIMEOUT);
                    Element body = doc.select("body").first();
                    body.attr("style", "background-color: transparent");
                    return new String[]{doc.baseUri(), doc.outerHtml(), "text/html", null, null};
                } catch (MalformedURLException e) {
                } catch (IOException e) {
                }
                return null;
            }
            @Override
            protected void onPostExecute(String[] result) {
                if (result != null) {
                    mView.loadDataWithBaseURL(result[0], result[1], result[2], result[3], result[4]);
                    // Note: This is more or less required to be called again here.
                    mView.setBackgroundColor(Color.TRANSPARENT);
                } else {
                    // Fancy error handling goes here
                }
            }
        }.execute();
    }
}

此示例应加载stackoverflow.com页面并将其变为半透明，并允许持有WebView的LinearLayout中的红色“闪烁”。至少应该在ICS上工作。

如何将透明html加载到具有背景的webview中

2 个答案: