Markdown変換でのHTMLインラインスタイルの処理
Markdown変換時にHTMLインラインスタイル(style属性)がどのように処理されるかを解説。近似可能なスタイルと失われるスタイルについて学びます。
Text Formatting
詳細な説明
HTMLインラインスタイルからMarkdownへの変換
MarkdownはCSSスタイリングをサポートしないため、インライン style 属性は通常変換時に除去されます。ただし、一部のスタイルはMarkdown構文で近似できます。
Markdownにマッピングされるスタイル
特定のCSSプロパティにはMarkdownの同等表現があります:
font-weight: bold→**テキスト**font-style: italic→*テキスト*text-decoration: line-through→~~テキスト~~(GFM)
失われるスタイル
ほとんどのCSSプロパティにはMarkdownの同等表現がなく、単純に削除されます:
color、font-size、text-decoration: underline、background-colorなど
スタイルの意図の保持
スタイル付きHTMLを変換する際、スタイリングの背後にある意図を考慮します:
- 色付きテキスト — 「エラー:」のようなコンテキスト語を追加
- フォントサイズの変更 — セクションヘッダーとして使用されている場合、適切な見出しレベルに変換
- 背景ハイライト — 太字にするか引用ブロックを使用して注意を引く
- 配置 — Markdownはテーブル外でのテキスト配置をサポートしない
ユースケース
インラインスタイルの処理は、リッチテキストエディタ(TinyMCEやCKEditor)、WYSIWYGメールビルダー、ワードプロセッサが生成するHTMLからコンテンツを変換する際に重要です。何が失われるかを理解することで、変換後のクリーンアップを計画できます。