将css文件转换为HTML格式的内联样式使用npm包

我有HTML文件和外部CSS文件，喜欢将外部样式表中的样式内嵌到头顶部的一个内嵌<style>标签。在此先感谢您的帮助将css文件转换为HTML格式的内联样式使用npm包

注意：不要使用样式属性应用到每一个元素，希望有在顶部

一个风格标签转换

p { 
 
    color: red; }

<!DOCTYPE html> 
 
<html lang="en"> 
 
<head> 
 
\t <meta charset="utf-8"> 
 
\t <title>HTML Template</title> 
 
\t <link rel="stylesheet" type="text/css" href="css/mystyle.css"> 
 
\t <script type="text/javascript" src="js/myscript.js"></script> 
 
</head> 
 
<body> 
 
\t <p>Welcome to Template!!</p> 
 
</body> 
 
</html>

之前

转换后

<!DOCTYPE html> 
 
<html lang="en"> 
 
<head> 
 
\t <meta charset="utf-8"> 
 
\t <title>HTML Template</title> 
 
    <!-- START: Replaced inline tag from external css file mystyle.css as above--> 
 
\t <style> 
 
    .p{color:red} 
 
    </style> 
 
    <!-- END: Replaced inline tag from external css file mystyle.css as above--> 
 
\t <script type="text/javascript" src="js/myscript.js"></script> 
 
</head> 
 
<body> 
 
\t <p>Welcome to Template!!</p> 
 
</body> 
 
</html>

来源

2017-09-16 Mohamed Hussain

你可以开始让你的HTML文件从网页浏览器如果您使用PHP，你可以把它用下面的命令php -S 127.0.0.1:4000运行访问，请确保您可以通过打开本地主机访问它访问：在4000你的网页浏览器，也有另一种方式如何从其它语言的访问，但它的出这个问题的范围

的第二个步骤是安装inliner NPM包npm install -g inliner

和execu TE inliner http://localhost:4000 > output.html

开放output.html看到的结果

执行inliner -i http://localhost:4000 > output.html如果你不想将图像转换成编码

的base64

来源

2018-03-10 08:42:58

将css文件转换为HTML格式的内联样式使用npm包

回答

相关问题