style タグ内の CSS を Inline style に変換する npm Juice が HTML メールに便利

Tadashi Shigeoka ·  Tue, May 1, 2018

style タグ内の CSS を Inline style に変換してくれる npm Juice が HTML メール作成に便利なのでご紹介します。

npm | エヌピーエム

npm Juice で CSS を Inline style へ変換する

以下のような JavaScript コードを実行すると、

var juice = require('juice');
var result = juice("
");

result には 以下のような Inline style 化された HTML が格納されます。

ちなみに昔、Gmail には style タグを利用できませんでしたが、2016年10月からは利用できるようになっています。

CSS → Inline Style 変換サイト

オンラインで style タグを Inline Style 化してくれるサイトも用意されています。

以上、HTML メール作成のために style タグを inlines CSS 化したい現場からお送りしました。