Markdown内のHTML — HTMLパススルー
MarkdownからHTMLへの変換時に、生のHTMLタグがどのようにパススルーされるかを理解します。動作する要素、セキュリティの考慮事項、生のHTMLを使用すべきタイミングを学びます。
Advanced
詳細な説明
Markdown内の生のHTML
Markdownの設計原則の一つは、ドキュメントのどこでも生のHTMLを使用できることです。ほとんどのMarkdownパーサーはHTMLタグをそのまま出力に渡します。
ブロックレベルのHTML
ブロックレベルのHTML要素(<div>、<table>、<section> など)は、前後のコンテンツから空行で区切る必要があります。
重要: ブロックレベルのHTML要素内ではMarkdown構文は処理されません。<div> 内の **太字** は <strong> に変換されません。
インラインHTML
インラインHTML要素(<span>、<abbr>、<mark> など)はMarkdownテキスト内で使用できます。ブロックレベルHTMLとは異なり、インラインHTML要素の周囲ではMarkdown構文は処理されます。
生のHTMLの一般的な使用例
- カスタム属性:
id、class、styleを要素に追加 - 複雑なテーブル:
colspan、rowspan、複数行セル - 埋め込みメディア:
<video>、<audio>、<iframe>要素 - 詳細/サマリー:
<details>と<summary>による折りたたみセクション
セキュリティの考慮事項
多くのMarkdownレンダラーはXSS攻撃を防ぐためにHTMLをサニタイズします。<script>、<style>、イベントハンドラ(onclick、onerror)は通常除去されます。
ユースケース
HTMLパススルーは、Markdown構文では不十分な場合に使用されます — 動画の埋め込み、複雑なレイアウトの作成、カスタムCSSクラスの追加、<details>、<figure>、<aside>などのセマンティックHTML要素の使用などです。MarkdownのシンプルさとHTMLの完全な表現力の橋渡しをします。