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の一般的な使用例

  • カスタム属性: idclassstyle を要素に追加
  • 複雑なテーブル: colspanrowspan、複数行セル
  • 埋め込みメディア: <video><audio><iframe> 要素
  • 詳細/サマリー: <details><summary> による折りたたみセクション

セキュリティの考慮事項

多くのMarkdownレンダラーはXSS攻撃を防ぐためにHTMLをサニタイズします。<script><style>、イベントハンドラ(onclickonerror)は通常除去されます。

ユースケース

HTMLパススルーは、Markdown構文では不十分な場合に使用されます — 動画の埋め込み、複雑なレイアウトの作成、カスタムCSSクラスの追加、<details>、<figure>、<aside>などのセマンティックHTML要素の使用などです。MarkdownのシンプルさとHTMLの完全な表現力の橋渡しをします。

試してみる — Markdown to HTML Converter

フルツールを開く