スマートフォン用の表示で見る

はてなダイアリーガイド「日記の中で使うタグ(3)」

横罫線を引く(hr)

hrタグは横罫線(horizontal rule)を引くために使います。

日記の中で使うタグ2に戻る← | →はてなダイアリーのHTMLに進む

><hr><

* ふりがな:はてなだいありーがいどにっきのな

のように書くと(なぜ「>」と「<」がつくのかは後述

日記の中で使うタグ2に戻る← | →はてなダイアリーのHTMLに進む


* ふりがな:はてなだいありーがいどにっきのな

のように表示されます(テーマやスタイルシートによる差はあり)。ブロック要素なので前後は改行されます。

改行する(br)

brタグは強制的に行を折り返すために使います。終了タグはいりません。

彼女は<br>「げげっ」<br>が口癖。

と書くと

彼女は
「げげっ」
が口癖。

のようになります。とても有名なタグだと思いますが、はてなダイアリーでは多分あまり使いません。

このタグで改行するとはてなダイアリーで自動的に発生する「段落間」が生じないため、行と行のあいだをせまくすることはできるのですが、その目的ならはてなダイアリーTipsスタイルシートでデザイン編【段落の前後のすき間をなくす方法】を使う方がはるかに便利でしょう。

また編集画面で3連続改行(2行空ける)すると、brタグが挿入されます。

表示されない文章を書く(コメント)

<!--」と「-->」の間に書いた文章は、ブラウザで表示されないコメントになります。コメント化して非表示にすることを「コメントアウトする」とも言います。

普通のHTML文書では、ソース画面ではコメントが読めるのですが、はてなダイアリーではソース画面にもこのコメントを表示しない機能になっています。(はてなダイアリーのヘルプ - 下書き記法を使う(下書き記法)

  • 【補足】スタイルシート欄のコメントは「/*」と「*/」を使います。

リストを作る(ulとol)

番号つきのリスト(ordered list…序列リスト)が「ol」要素、

番号なしのリスト(unordered list…順不同リスト)が「ul」要素です。

リスト項目は<li></li>で囲みます。

><ol>

<li>フタをとりカバー等を外します。</li>

<li>よくかきまぜます。</li>

<li>ごはんにかけます。</li>

</ol><


><ul>

<li>もも</li>

<li>ぶどう</li>

<li>すいか</li>

</ul><

のように書くと(なぜ「>」と「<」がつくのかは後述)、それぞれ

  1. フタをとりカバー等を外します。
  2. よくかきまぜます。
  3. ごはんにかけます。

  • もも
  • ぶどう
  • すいか

のようになります。

これは「+」と「-」を使ったはてなの省略記法(リスト記法)でも作れます。

ol(ul)要素の中にまたol(ul)要素を作って入れ子にすることもできます。

><ol>

<li>フタをとりカバー等を外します。</li>

<li>よくかきまぜます。

<ul>

<li>醤油や辛子は徹底的に混ぜたあとで入れます</li>

<li>私は右周りに50回、左周りに50回ほど混ぜています</li>

</ul>

</li>

<li>ごはんにかけます。</li>

</ol>
のようにすると(li要素の中にul要素やol要素を入れていきます。はてな記法のHTMLの展開のしかたのほうが誤りになります。)
  1. フタをとりカバー等を外します。
  2. よくかきまぜます。
    • 醤油や辛子は徹底的に混ぜたあとで入れます
    • 私は右周りに50回、左周りに50回ほど混ぜています
  3. ごはんにかけます。
のようになります。これは省略記法ですと
+フタをとりカバー等を外します。
+よくかきまぜます。
--醤油や辛子は徹底的に混ぜたあとで入れます
--私は右周りに50回、左周りに50回ほど混ぜています
+ごはんにかけます。
のように書きます。すごく楽なのでタグを書くのが嫌になります。標準の編集画面では、入力支援ボタンもあります。
  • 【補足】省略記法では、同じ階層で番号つきと番号なしを混在させるということはできません。

定義リストを作る(dl)

定義リストっていうのもあります。「定義」文に限るといったわけではないようで、ある言葉と記述に関連性を持たせて表記したいときに使うもののようです。例えば
dl
定義リストを作るタグ。(definition list)
dt
記述される言葉。(definition term)
dd
言葉に対する記述。(definition description)
のような、言葉とそれに関係する記述のリストになります。これをタグで書くには
><dl> <dt>dl</dt> <dd>定義リストを作るタグ。(definition list)</dd> <dt>dt</dt> <dd>記述される言葉。(definition term)</dd> <dt>dd</dt> <dd>言葉に対する記述。(definition description)</dd> </dl>
のようにします。 はてなの省略記法では
:dl:定義リストを作るタグ。(definition list)
:dd:記述される言葉。(definition term)
:dt:言葉に対する記述。(definition description)
のように書きます。楽です。
  • 【補足】定義リストの省略記法では、深い入れ子を作ることはできません。

日記の中で使うタグ(2)に戻る← | →はてなダイアリーのHTMLに進む