想要转换一个html和css文件，只需在每个标记中包含一个css的一个html文件中

时间：2019-04-28 10:30:43

标签： html css

我用1个HTML文件和4个CSS文件创建了新闻稿模板。但是，当我发送新闻时，CSS没有链接。因此，我想创建一个HTML文件，并在每个标签中直接包含CSS。对于我在HTML中使用的每个CSS标签，我希望此标签在CSS文件中的所有实际值都直接在HTML标签中。我该怎么办？

旧代码

CSS代码

<style>
.mycss{
    width:100px;
    color: red;
}
</style>

html代码

<html>
    <div class="mycss">
      //some code
    </div>

</html>

我希望那成为

CSS代码

html代码

<html>
    <div style="width:100px; color: red;">
      //some code
    </div>
</html>

2 个答案:

答案 0 :(得分：0)

使用Mailchimp's CSS Inliner Tool之类的CSS内联器来完成此操作。

这是我用于撰写新闻通讯的过程：

复制并粘贴HTML文件中<style></style>标签之间的各种CSS文件中的CSS
复制该文件中的所有代码，然后将其粘贴到Mailchimp's CSS Inliner Tool
点击转换
复制并使用现在内联CSS的结果代码。

答案 1 :(得分：0)

您会不会从中寻找东西？

console.log(document.styleSheets[0].cssRules[0].cssText )
console.log(document.styleSheets[0].cssRules[1].cssText )

/*
for (let styl of document.styleSheets )  {

    for (let rules of styl.cssRules){
        console.log( rules.cssText )
    }
}
*/

.class01 {
    border: 1px solid blue;
    width:200px;
    height: 50px;
}

.class02 {
    border: 1px solid red;
    width:300px;
    height: 30px;
}

<div class="class01">MyDiv 01</div>

<div class="class02">MyDiv 02</div>