Khizar Shujaat
Khizar Shujaat

Reputation: 471

Convert internal stylesheet to inline css

how can i convert internal stylesheet to inline css of a page without using any online source. I have style defined as

<style  id="custstyle" type="text/css">
            .column{
                font-size:13px;
                font-family:arial, helvetica, verdana, sans-serif;
                font-weight:normal;
                color:rgb(221, 221, 221);
                font-size:13px;
                font-family:arial, helvetica, verdana, sans-serif;
                font-weight:normal;
                color:rgb(221, 221, 221);
            }
        </style> 

this sets style for

<div id="sidebar-right" class="column">Content</div>

but i want to convert all internal css automatically to inline css

Upvotes: 2

Views: 1975

Answers (3)

Suhas Gosavi
Suhas Gosavi

Reputation: 2170

select all the div that has the column class and remove class column if it is there then apply inline CSS using jquery.

$(document).ready(function(){
var obj = $(".column");
$(obj).each(function(){
    $(this).removeClass("column");//not really necessary
    $(this).css({"font-size":"13px","font-family":"arial,helvetica, verdana, sans-serif",          
            "font-weight":"normal",
            "color":"rgb(221, 221, 221)",
            "font-weight":"normal"});
});
});

Working Fiddle

Upvotes: 0

ProllyGeek
ProllyGeek

Reputation: 15836

this script will get you the computed CSS , after wards , you can set attribute using jquery .css() , or pure js .setAttribute("style","calculated_value");

http://jsfiddle.net/prollygeek/twP6S/112/

 $(document).ready(function()
                  {
xx=window.getComputedStyle(document.getElementById('stylediv')).cssText
document.getElementById('stylediv').setAttribute("style",xx)

                  });

this will answer your question , but concerning mailer , i dont know , needs further investegations !!

Upvotes: 2

maembe
maembe

Reputation: 1300

Can you give more specifics about what you're trying to accomplish?

You could probably do something similar to

$('#sidebar-right').attr('style',$(.custstyle).text().split('{')[1].replace('}',''))

Since the styles follow the same format but that seems like a rather silly thing to do. Maybe if you told us what you want to achieve we could be of more help.

Upvotes: 1

Related Questions