นี่คือวิธีแก้ปัญหาของฉันโดยใช้ JavaScript:
var css = [];
for (var i=0; i<document.styleSheets.length; i++)
{
var sheet = document.styleSheets[i];
var rules = ('cssRules' in sheet)? sheet.cssRules : sheet.rules;
if (rules)
{
css.push('\n/* Stylesheet : '+(sheet.href||'[inline styles]')+' */');
for (var j=0; j<rules.length; j++)
{
var rule = rules[j];
if ('cssText' in rule)
css.push(rule.cssText);
else
css.push(rule.selectorText+' {\n'+rule.style.cssText+'\n}\n');
}
}
}
var cssInline = css.join('\n')+'\n';
ในตอนท้ายcssInlineคือรายการข้อความของแผ่นเหล็กทั้งหมดของหน้าและเนื้อหา
ตัวอย่าง:
.javascript .de1, .javascript .de2 { -webkit-user-select: text; padding: 0px 5px; vertical-align: top; color: rgb(0, 0, 0); border-left-width: 1px; border-left-style: solid; border-left-color: rgb(204, 204, 204); margin: 0px 0px 0px -7px; position: relative; background: rgb(255, 255, 255); }
.javascript { color: rgb(172, 172, 172); }
.javascript .imp { font-weight: bold; color: red; }
html { }
body { color: rgb(24, 24, 24); font-family: 'segoe ui', 'trebuchet MS', 'Lucida Sans Unicode', 'Lucida Sans', sans-serif; font-size: 1em; line-height: 1.5em; margin: 0px; padding: 0px; background: url(http://pastebin.com/i/bg.jpg); }
a { color: rgb(204, 0, 51); text-decoration: none; }
a:hover { color: rgb(153, 153, 153); text-decoration: none; }
.icon24 { height: 24px; vertical-align: middle; width: 24px; margin: 0px 4px 0px 10px; }
#header { border-radius: 0px 0px 6px 6px; color: rgb(255, 255, 255); background-color: rgb(2, 56, 89); }
#super_frame { min-width: 1100px; width: 1200px; margin: 0px auto; }
#monster_frame { -webkit-box-shadow: rgb(204, 204, 204) 0px 0px 10px 5px; box-shadow: rgb(204, 204, 204) 0px 0px 10px 5px; border-radius: 5px; border: 1px solid rgb(204, 204, 204); margin: 0px; background-color: rgb(255, 255, 255); }
#header a { color: rgb(255, 255, 255); }
#menu_2 { height: 290px; }
.hidden { display: none; }
