CSSをインラインCSSにして、HTMLに埋め込んでくれるサービス「HTML email inline styler」

CSSをインラインCSSにして、HTMLに埋め込んでくれるサービス「HTML email inline styler」の紹介です。

CSS0906181.jpg

<html>
	<head>
		<title>Example</title>
		<link rel="stylesheet" href="http://inlinestyler.torchboxapps.com/static/css/example.css" />
	</head>
	<body>
		<style type="text/css">
			h1{
				color:yellow
			}
		</style>
		<h1>An example title</h1>
		<p>Paragraph 1</p>
		<p class="p2">Paragraph 2</p>
	</body>
</html>

上記のソースは、サイト側で用意しているサンプルのものですが、外部スタイルシートやstyle要素を使っています。これを、Convertすると下記のようになります。

lt;html>
  <head>
    <title>Example</title>
  </head>
  <body>
		<h1 style="color: yellow">An example title</h1>
		<p style="margin: 0;padding: 0 0 10px 0">Paragraph 1</p>
		<p class="p2" style="margin: 0;padding: 0 0 10px 0">Paragraph 2</p>
	</body>
</html>

外部スタイルシートやstyle要素が無くなり、style属性が生成されて、それをHTMLに埋めこんでくれます。

style属性を使ってのコーディングは、しないと思いますが、古い機種を意識した携帯サイト作成のときぐらいだと思いますが、style属性に変更しなければならない時には非常に有効なサービスです。