Android How to load Custom CSS on external HTML page in WebView


Tags: android,css

Problem :

I want to apply my custom CSS on HTML page i tried this way but it is not working.

 wv.loadUrl("<style>.featured {"+
        "   background-image: -ms-linear-gradient(bottom, #F9F6F9 0%, #ECE4F4 100%);"+
        "   background-image: -moz-linear-gradient(bottom, #F9F6F9 0%, #ECE4F4 100%);"+
        "   background-image: -o-linear-gradient(bottom, #F9F6F9 0%, #ECE4F4 100%);"+
        "background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0, #F9F6F9), color-stop(1, #ECE4F4));"+
        "   background-image: -webkit-linear-gradient(bottom, #F9F6F9 0%, #ECE4F4 100%);"+
        "   background-image: linear-gradient(to top, #F9F6F9 0%, #ECE4F4 100%);"+
        "}"); 

please help me out.



Solution :

Thank you for your answers guys but i got my solution.

This my solution.

wv.loadUrl("javascript:(function() { " +                        
    "var divs = document.getElementsByClassName('free');"+
     "for(var i=0; i<divs.length; i++)"+
     "{"+
        "divs[i].style.backgroundImage='-webkit-gradient(linear, left bottom, left top, color-stop(0, #FFFFFF), color-stop(1, #EFD2E4))';"+
      "}"+
     "})()");   

using this you can apply your custom CSS on any Tag or Elements of the HTML in Android.


    CSS Howto..

    The UI Designers and Marketing people at my company don't want “awkward line breaks”. How to do with CSS or JS? [closed]

    Why margin:2.5px does not work? How to solve this problem

    show content block on right above the content on right when displaying on mobile

    How to set width correctly in CSS - Need to fix bug with Safari on Mac and on iPad

    How to add padding to the cells of a table with CSS [closed]

    How to change CSS based on Season using JavaScript

    How to override margin and right/left in css?

    jquery how to make an element comeback to initial position after animation

    How to refactor CSS based on HTML class

    How to properly separate pages in jQuery Mobile?

    How do I make the Brand, links, and facebook link on the same line? Bootstrap 3

    How to load dynamic content (get, html, data) via jquery/css in Wordpress?

    How can I turn a bullet image into a link?

    How to add multiple CSS classes to an single array

    CSS - How to make rectangle with pointed sides? [duplicate]

    How to make JqueryUi Slider vertical-align middle?

    How can I create an addin in Visual Studio to generate javascript, CSS and other code from a settings file

    How to fix the Wordpress (Twenty Eleven) CSS Menu Alignment?

    How to do this kind of Button in CSS?

    Css. How to move div with fixed position up if it overlays footer

    How to make a split screen video with full height?

    tooltip box not showing using css

    How can I dock the button to jQueryUI dialog bottom as the dialog inner content increases?

    How does the Meebo bar work so well cross-browser?

    CSS how to show menu sub li when menu has position fixed

    How to determine why floated elements are affecting the heights of non-floated elements (D7 views blocks with zen theme)?

    How to CSS a two column list of items?

    JavaScript and SEO. How Should I reconcile them?

    Chrome inspector not showing body outline correctly

    How do I make my css class footer go from the left to right side of the screen?