how to add external css file on html page in Android

Question

I am working on an application with many html pages. I have created these in the raw folder on Eclipse.

I'm going to be making many html files and I want to have only one location for the css file which I want to call in each of the html files. This application works in such a way that the loadData method displays the html page as shown below:

webview.loadData(readTextFromResource(R.raw.gen1), "text/html", "utf-8");

Id appreciate any ideas.

use assets folder to keep html file & relative reference of css file in that html file — Vishal Pawar
– Vishal Pawar, Commented Jun 26, 2012 at 9:30

Dinesh · Accepted Answer · 2012-06-26 09:37:47Z

7

you can copy html and css files in your project assets and load html file from asset to webview like below code:

    WebView wv;  
    wv = (WebView) findViewById(R.id.webView1);  
    wv.setBackgroundColor(0);
    wv.setBackgroundResource(android.R.color.black);
    wv.setWebChromeClient(new WebChromeClient());
    wv.setWebViewClient(new WebViewClient());
    wv.getSettings().setJavaScriptEnabled(true);
    wv.getSettings().setPluginsEnabled(true);
    wv.loadUrl("file:///android_asset/Index_Animation/test.html");

like below screen shot:

enter image description here

and refer css in html file below:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<link rel="stylesheet" href="./style.css" type="text/css" media="screen"><!--This line refer the css file-->

  </head>
    <body bgcolor="#000000">        

                <div class="col_left">
                    <div class="logo">
                        <div class="circles">
                            <div class="circle"></div>
                            <div class="circle1"></div>
                            <div class="circle2"></div>
                        </div>
                        <center>
                        <img src="./Untitled.png" />
                        </center>
                    </div>

                </div>

</body></html>

edited Jun 26, 2012 at 9:37

answered Jun 26, 2012 at 9:31

Dinesh

6,54210 gold badges45 silver badges77 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

NagarjunaReddy Over a year ago

In case my html is dynamic data how to use this.

Collectives™ on Stack Overflow

how to add external css file on html page in Android

1 Answer 1

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related