[{"data":1,"prerenderedAt":917},["ShallowReactive",2],{"content-/html-elements-in-markdown":3,"all-pages-for-dir":894,"related-/html-elements-in-markdown":895,"og-image-/html-elements-in-markdown":916},{"id":4,"title":5,"body":6,"category":880,"concepts":880,"description":881,"extension":882,"meta":883,"navigation":194,"ogImage":880,"path":884,"project_name":880,"published":885,"publishedAt":886,"seo":887,"source":880,"stem":888,"tags":889,"todo":880,"unpublished":885,"updatedAt":886,"__hash__":893},"pages/2025-12/2025-12-23/html-elements-in-markdown.md","マークダウンで使えるHTML要素一覧",{"type":7,"value":8,"toc":818},"minimark",[9,13,17,20,25,30,36,40,48,55,59,67,71,83,87,99,103,109,113,120,124,131,135,146,150,158,160,164,168,192,205,208,229,231,235,239,244,248,262,266,277,286,290,300,304,315,317,321,324,370,373,436,438,442,446,456,459,470,472,476,480,508,510,514,518,532,536,544,546,550,553,558,562,565,579,582,614,617,623,626,637,640,648,651,659,661,665,668,683,686,700,702,706,710,713,716,720,729,733,742,746,756,760,778,782,793,795,798],[10,11,5],"h1",{"id":12},"マークダウンで使えるhtml要素一覧",[14,15,16],"p",{},"このページでは、Nuxt Content（MDX/MDC）で使用可能なHTML要素を実際に表示して確認できます。",[18,19],"hr",{},[21,22,24],"h2",{"id":23},"_1-テキスト装飾系","1. テキスト装飾系",[26,27,29],"h3",{"id":28},"ハイライトmark","ハイライト（mark）",[14,31,32],{},[33,34,35],"mark",{},"これはハイライトされたテキストです",[26,37,39],{"id":38},"上付き下付き文字sup-sub","上付き・下付き文字（sup / sub）",[14,41,42,43,47],{},"H",[44,45,46],"sub",{},"2","O（水の化学式）",[14,49,50,51,54],{},"E = mc",[52,53,46],"sup",{},"（アインシュタインの式）",[26,56,58],{"id":57},"略語abbr","略語（abbr）",[14,60,61,66],{},[62,63,65],"abbr",{"title":64},"HyperText Markup Language","HTML","は、ウェブページの構造を定義する言語です。",[26,68,70],{"id":69},"キーボード入力kbd","キーボード入力（kbd）",[14,72,73,74,78,79,82],{},"コピーするには ",[75,76,77],"kbd",{},"Ctrl"," + ",[75,80,81],{},"C"," を押してください。",[26,84,86],{"id":85},"取り消し線と追記del-ins","取り消し線と追記（del / ins）",[14,88,89,90,94,98],{},"この機能は",[91,92,93],"del",{},"廃止されました",[95,96,97],"ins",{},"v2.0で復活しました","。",[26,100,102],{"id":101},"小さい文字small","小さい文字（small）",[14,104,105],{},[106,107,108],"small",{},"※これは注釈です。小さい文字で表示されます。",[26,110,112],{"id":111},"引用元cite","引用元（cite）",[14,114,115,119],{},[116,117,118],"cite",{},"『となりのトトロ』","は1988年に公開されました。",[26,121,123],{"id":122},"定義dfn","定義（dfn）",[14,125,126,130],{},[127,128,129],"dfn",{},"API","とは、Application Programming Interfaceの略です。",[26,132,134],{"id":133},"変数var","変数（var）",[14,136,137,138,78,142,145],{},"方程式 ",[139,140,141],"var",{},"x",[139,143,144],{},"y"," = 10 を解きなさい。",[26,147,149],{"id":148},"サンプル出力samp","サンプル出力（samp）",[14,151,152,153,157],{},"コマンドを実行すると、",[154,155,156],"samp",{},"Hello, World!"," と出力されます。",[18,159],{},[21,161,163],{"id":162},"_2-インタラクティブ系","2. インタラクティブ系",[26,165,167],{"id":166},"折りたたみdetails-summary","折りたたみ（details / summary）",[169,170,171,172,176,179],"details",{},"\n  ",[173,174,175],"summary",{},"クリックして詳細を表示",[14,177,178],{},"これは折りたたまれていた内容です。",[180,181,182,186,189],"ul",{},[183,184,185],"li",{},"リスト項目1",[183,187,188],{},"リスト項目2",[183,190,191],{},"リスト項目3",[169,193,171,195,198],{"open":194},true,[173,196,197],{},"最初から開いている折りたたみ",[14,199,200,204],{},[201,202,203],"code",{},"open","属性を付けると、最初から開いた状態で表示されます。",[26,206,207],{"id":207},"ネストした折りたたみ",[169,209,171,210,171,213],{},[173,211,212],{},"レベル1",[169,214,215,216,219,171],{},"\n    ",[173,217,218],{},"レベル2",[220,221,226],"pre",{"className":222,"code":224,"language":225},[223],"language-text","\u003Cdetails>\n  \u003Csummary>レベル3\u003C/summary>\n\n  最深部のコンテンツです。\n\u003C/details>\n","text",[201,227,224],{"__ignoreMap":228},"",[18,230],{},[21,232,234],{"id":233},"_3-レイアウト系","3. レイアウト系",[26,236,238],{"id":237},"汎用コンテナdiv","汎用コンテナ（div）",[240,241,243],"div",{"style":242},"padding: 1rem; background-color: #f0f0f0; border-radius: 8px;","\n  これはdivで囲まれたコンテンツです。背景色とパディングを設定しています。\n",[26,245,247],{"id":246},"インライン要素span","インライン要素（span）",[14,249,250,251,256,257,261],{},"これは",[252,253,255],"span",{"style":254},"color: red;","赤い文字","と",[252,258,260],{"style":259},"color: blue;","青い文字","を含む文章です。",[26,263,265],{"id":264},"セクション分けsection","セクション分け（section）",[267,268,270,274],"section",{"style":269},"border-left: 4px solid #3498db; padding-left: 1rem;",[271,272,273],"h4",{"id":273},"セクション1",[14,275,276],{},"これはsectionタグで囲まれた領域です。",[267,278,280,283],{"style":279},"border-left: 4px solid #e74c3c; padding-left: 1rem;",[271,281,282],{"id":282},"セクション2",[14,284,285],{},"別のセクションです。",[26,287,289],{"id":288},"記事article","記事（article）",[291,292,294,297],"article",{"style":293},"border: 1px solid #ddd; padding: 1rem; margin: 1rem 0;",[271,295,296],{"id":296},"記事タイトル",[14,298,299],{},"これはarticleタグで囲まれた独立したコンテンツです。",[26,301,303],{"id":302},"サイドバーaside","サイドバー（aside）",[305,306,308],"aside",{"style":307},"background-color: #fffbcc; padding: 1rem; border-radius: 4px;",[14,309,310,314],{},[311,312,313],"strong",{},"補足情報",": asideタグは本文から少し離れた補足情報に使います。",[18,316],{},[21,318,320],{"id":319},"_4-テーブル系","4. テーブル系",[26,322,323],{"id":323},"基本テーブル",[325,326,171,327,171,344],"table",{},[328,329,215,330,171],"thead",{},[331,332,333,334,333,338,333,341,215],"tr",{},"\n      ",[335,336,337],"th",{},"名前",[335,339,340],{},"年齢",[335,342,343],{},"職業",[345,346,215,347,215,359,171],"tbody",{},[331,348,333,349,333,353,333,356,215],{},[350,351,352],"td",{},"田中太郎",[350,354,355],{},"30",[350,357,358],{},"エンジニア",[331,360,333,361,333,364,333,367,215],{},[350,362,363],{},"山田花子",[350,365,366],{},"25",[350,368,369],{},"デザイナー",[26,371,372],{"id":372},"セル結合テーブル",[325,374,171,375,171,400],{},[328,376,215,377,215,386,171],{},[331,378,333,379,333,381,215],{},[335,380],{},[335,382,385],{"colSpan":383,"style":384},"3","text-align: center;","売上（万円）",[331,387,333,388,333,391,333,394,333,397,215],{},[335,389,390],{},"店舗",[335,392,393],{},"1月",[335,395,396],{},"2月",[335,398,399],{},"3月",[345,401,215,402,215,417,215,423,171],{},[331,403,333,404,333,408,333,411,333,414,215],{},[335,405,407],{"rowSpan":406},2,"東京",[350,409,410],{},"100",[350,412,413],{},"120",[350,415,416],{},"130",[331,418,333,419,215],{},[350,420,422],{"colSpan":383,"style":421},"text-align: center; background-color: #f0f0f0;","合計: 350",[331,424,333,425,333,428,333,431,333,434,215],{},[335,426,427],{},"大阪",[350,429,430],{},"80",[350,432,433],{},"90",[350,435,410],{},[18,437],{},[21,439,441],{"id":440},"_5-メディア系","5. メディア系",[26,443,445],{"id":444},"図とキャプションfigure-figcaption","図とキャプション（figure / figcaption）",[447,448,171,449,171,452],"figure",{"style":384},[240,450],{"style":451},"width: 200px; height: 100px; background: linear-gradient(45deg, #3498db, #9b59b6); margin: 0 auto; border-radius: 8px;",[453,454,455],"figcaption",{},"図1: グラデーションのサンプル",[26,457,458],{"id":458},"画像とキャプション",[447,460,171,461,171,467],{},[462,463],"img",{"src":464,"alt":465,"style":466},"https://via.placeholder.com/300x150","プレースホルダー画像","max-width: 100%;",[453,468,469],{},"図2: プレースホルダー画像の例",[18,471],{},[21,473,475],{"id":474},"_6-リスト系","6. リスト系",[26,477,479],{"id":478},"説明リストdl-dt-dd","説明リスト（dl / dt / dd）",[481,482,171,483,171,488,171,492,171,497,171,500,171,505],"dl",{},[484,485,486],"dt",{},[311,487,65],{},[489,490,491],"dd",{},"ウェブページの構造を定義するマークアップ言語",[484,493,494],{},[311,495,496],{},"CSS",[489,498,499],{},"ウェブページのスタイルを定義するスタイルシート言語",[484,501,502],{},[311,503,504],{},"JavaScript",[489,506,507],{},"ウェブページに動的な機能を追加するプログラミング言語",[18,509],{},[21,511,513],{"id":512},"_7-引用系","7. 引用系",[26,515,517],{"id":516},"ブロック引用blockquote","ブロック引用（blockquote）",[519,520,171,522,171,525],"blockquote",{"style":521},"border-left: 4px solid #ccc; padding-left: 1rem; margin-left: 0; font-style: italic;",[14,523,524],{},"シンプルさは究極の洗練である。",[526,527,528,529],"footer",{},"— ",[116,530,531],{},"レオナルド・ダ・ヴィンチ",[26,533,535],{"id":534},"インライン引用q","インライン引用（q）",[14,537,538,539,543],{},"彼は",[540,541,542],"q",{},"明日やろうは馬鹿野郎","と言った。",[18,545],{},[21,547,549],{"id":548},"_8-フォーム要素表示のみ","8. フォーム要素（表示のみ）",[26,551,552],{"id":552},"入力フィールド",[554,555],"input",{"type":225,"placeholder":556,"style":557},"テキスト入力","padding: 0.5rem; margin: 0.25rem;",[554,559],{"type":560,"placeholder":561,"style":557},"number","数値入力",[26,563,564],{"id":564},"セレクトボックス",[566,567,171,569,171,573,171,576],"select",{"style":568},"padding: 0.5rem;",[570,571,572],"option",{},"オプション1",[570,574,575],{},"オプション2",[570,577,578],{},"オプション3",[26,580,581],{"id":581},"チェックボックスとラジオボタン",[14,583,584,591,594,599,601,607,609],{},[585,586,587,590],"label",{},[554,588],{"type":589},"checkbox"," チェックボックス1",[592,593],"br",{},[585,595,596,598],{},[554,597],{"type":589,"checked":194}," チェックボックス2（チェック済み）",[592,600],{},[585,602,603,606],{},[554,604],{"type":605,"name":605},"radio"," ラジオボタン1",[592,608],{},[585,610,611,613],{},[554,612],{"type":605,"name":605,"checked":194}," ラジオボタン2（選択済み）",[26,615,616],{"id":616},"テキストエリア",[618,619],"textarea",{"rows":620,"style":621,"placeholder":622},3,"width: 100%; max-width: 300px;","複数行のテキスト入力",[26,624,625],{"id":625},"ボタン",[14,627,628,633],{},[629,630,632],"button",{"style":631},"padding: 0.5rem 1rem; margin: 0.25rem;","通常ボタン",[629,634,636],{"style":635},"padding: 0.5rem 1rem; margin: 0.25rem; background-color: #3498db; color: white; border: none; border-radius: 4px;","スタイル付きボタン",[26,638,639],{"id":639},"プログレスバー",[14,641,642,647],{},[643,644],"progress",{"value":645,"max":410,"style":646},"70","width: 200px;"," 70%",[26,649,650],{"id":650},"メーター",[14,652,653,647],{},[654,655],"meter",{"value":656,"min":657,"max":658,"style":646},"0.7","0","1",[18,660],{},[21,662,664],{"id":663},"_9-ルビふりがな","9. ルビ（ふりがな）",[26,666,667],{"id":667},"基本的なルビ",[669,670,671,672,676,680],"ruby",{},"\n  漢字",[673,674,675],"rp",{},"(",[677,678,679],"rt",{},"かんじ",[673,681,682],{},")",[26,684,685],{"id":685},"複数のルビ",[14,687,688,693,694,699],{},[669,689,407,690],{},[677,691,692],{},"とうきょう","から",[669,695,427,696],{},[677,697,698],{},"おおさか","まで。",[18,701],{},[21,703,705],{"id":704},"_10-その他","10. その他",[26,707,709],{"id":708},"水平線hr","水平線（hr）",[14,711,712],{},"上のコンテンツ",[18,714],{"style":715},"border: none; border-top: 2px dashed #ccc;",[26,717,719],{"id":718},"改行br","改行（br）",[14,721,722,723,725,726,728],{},"1行目",[592,724],{},"\n2行目",[592,727],{},"\n3行目",[26,730,732],{"id":731},"時間time","時間（time）",[14,734,735,736,741],{},"このイベントは",[737,738,740],"time",{"dateTime":739},"2025-12-25","2025年12月25日","に開催されます。",[26,743,745],{"id":744},"住所address","住所（address）",[747,748,749,750,752,753,755],"address",{},"\n  株式会社サンプル",[592,751],{},"\n  〒100-0001",[592,754],{},"\n  東京都千代田区1-1-1\n",[26,757,759],{"id":758},"マーク付きリストdata","マーク付きリスト（data）",[180,761,171,762,171,768,171,773],{},[183,763,764],{},[765,766,767],"data",{"value":658},"りんご",[183,769,770],{},[765,771,772],{"value":46},"みかん",[183,774,775],{},[765,776,777],{"value":383},"バナナ",[26,779,781],{"id":780},"双方向テキストbdo","双方向テキスト（bdo）",[14,783,784,785,787,788],{},"通常: Hello World",[592,786],{},"\n右から左: ",[789,790,792],"bdo",{"dir":791},"rtl","Hello World",[18,794],{},[21,796,797],{"id":797},"注意事項",[180,799,800,806,812,815],{},[183,801,802,805],{},[201,803,804],{},"\u003Cscript>"," タグはセキュリティ上使用できません",[183,807,808,811],{},[201,809,810],{},"\u003Cstyle>"," タグも基本的に使用できません（インラインスタイルは可）",[183,813,814],{},"イベントハンドラ（onclick等）は動作しません",[183,816,817],{},"iframe は外部サイトによっては表示されない場合があります",{"title":228,"searchDepth":406,"depth":406,"links":819},[820,832,836,843,847,851,854,858,867,871,879],{"id":23,"depth":406,"text":24,"children":821},[822,823,824,825,826,827,828,829,830,831],{"id":28,"depth":620,"text":29},{"id":38,"depth":620,"text":39},{"id":57,"depth":620,"text":58},{"id":69,"depth":620,"text":70},{"id":85,"depth":620,"text":86},{"id":101,"depth":620,"text":102},{"id":111,"depth":620,"text":112},{"id":122,"depth":620,"text":123},{"id":133,"depth":620,"text":134},{"id":148,"depth":620,"text":149},{"id":162,"depth":406,"text":163,"children":833},[834,835],{"id":166,"depth":620,"text":167},{"id":207,"depth":620,"text":207},{"id":233,"depth":406,"text":234,"children":837},[838,839,840,841,842],{"id":237,"depth":620,"text":238},{"id":246,"depth":620,"text":247},{"id":264,"depth":620,"text":265},{"id":288,"depth":620,"text":289},{"id":302,"depth":620,"text":303},{"id":319,"depth":406,"text":320,"children":844},[845,846],{"id":323,"depth":620,"text":323},{"id":372,"depth":620,"text":372},{"id":440,"depth":406,"text":441,"children":848},[849,850],{"id":444,"depth":620,"text":445},{"id":458,"depth":620,"text":458},{"id":474,"depth":406,"text":475,"children":852},[853],{"id":478,"depth":620,"text":479},{"id":512,"depth":406,"text":513,"children":855},[856,857],{"id":516,"depth":620,"text":517},{"id":534,"depth":620,"text":535},{"id":548,"depth":406,"text":549,"children":859},[860,861,862,863,864,865,866],{"id":552,"depth":620,"text":552},{"id":564,"depth":620,"text":564},{"id":581,"depth":620,"text":581},{"id":616,"depth":620,"text":616},{"id":625,"depth":620,"text":625},{"id":639,"depth":620,"text":639},{"id":650,"depth":620,"text":650},{"id":663,"depth":406,"text":664,"children":868},[869,870],{"id":667,"depth":620,"text":667},{"id":685,"depth":620,"text":685},{"id":704,"depth":406,"text":705,"children":872},[873,874,875,876,877,878],{"id":708,"depth":620,"text":709},{"id":718,"depth":620,"text":719},{"id":731,"depth":620,"text":732},{"id":744,"depth":620,"text":745},{"id":758,"depth":620,"text":759},{"id":780,"depth":620,"text":781},{"id":797,"depth":406,"text":797},null,"MDX/MDCで使用可能なHTML要素のショーケース","md",{},"/html-elements-in-markdown",false,"2025-12-23T00:00:00.000Z",{"title":5,"description":881},"2025-12/2025-12-23/html-elements-in-markdown",[890,891,892],"markdown","html","reference","8_biCbhnOcfsfUhNTcKlJsDEls6qVcp9m4U-0JlNDAg",[],[896,900,904,908,912],{"title":897,"path":898,"publishedAt":899},"マークダウン記事の$隣接**が数式化されて崩れる問題を発見、115ファイルの修正を明日に持ち越し","/dollar-sign-math-render-issue-triage","2026-07-16T00:00:00.000Z",{"title":901,"path":902,"publishedAt":903},"@nuxt/content で外部リンクを別タブで開く＋GFM autolinker の二重リンク回避ルールを永続化","/external-link-target-blank-rule","2026-06-06T00:00:00.000Z",{"title":905,"path":906,"publishedAt":907},"高千穂峡貸しボートの研究ノートを、矢印キーで進めるスライド形式UIに変えた","/takachiho-boat-research-slide-ui-2026-05-21","2026-05-21T00:00:00.000Z",{"title":909,"path":910,"publishedAt":911},"簿記3級26章をHTMLで量産する：サブエージェント並列とCodex統合レビューで一日仕上げた話","/bookkeeping3-26-chapters-html-pipeline","2026-05-01T00:00:00.000Z",{"title":913,"path":914,"publishedAt":915},"連結精算表のExcel風HTMLプロトタイプを試作する","/2026-04-30-consolidated-worksheet-html-prototype","2026-04-30T00:00:00.000Z","https://log.eurekapu.com/og/blog/html-elements-in-markdown.png?v=2025-12-23T00%3A00%3A00.000Z&title=%E3%83%9E%E3%83%BC%E3%82%AF%E3%83%80%E3%82%A6%E3%83%B3%E3%81%A7%E4%BD%BF%E3%81%88%E3%82%8BHTML%E8%A6%81%E7%B4%A0%E4%B8%80%E8%A6%A7&author=Kei%20Komatsu&sig=f1bf0cc4c0d5def2",1785654688833]