はてなブログ、HTMLタグの表示テスト
ブログ記事のHTML編集でよく使いそうなタグがテーマ「Epic」でどのように表示されるかテスト。 p要素
記事中の見出しは h3 から始める。記事タイトルが h2。h1から始めると見づらくなる。 p要素
このページのHTMLソース h3
<p>ブログ記事のHTML編集でよく使いそうなタグがどのように表示されるかテスト。 p要素</p> <p>記事中の見出しは h3 から始める。記事タイトルが h2。h1から始めると見づらくなる。 p要素</p> <h3>このページのHTMLソース h3</h3> <pre>(このソース)</pre> <h3>主要タグサンプル h3</h3> <h4>見出し4 h4</h4> <p>h5 と h6 は、h4と見分け付かないので使わない。</p> <h5>見出し5 h5</h5> <h6>見出し6 h6</h6> <p>段落 p です。見たまま編集で改行すると、p要素で括られます。ただ単に改行<br />したい場合は、シフトキーを押しならがら改行します。<q>文中の引用です。クォートで括られます。</q>段落の上下には、空き(マージン)ができます。</p> <p>編集画面のHTML編集で、ソース中の空行は削除されます。</p> <p><strong>太字strongです。</strong><strong>太字bです。</strong></p> <blockquote>引用文です。引用文です。引用文です。引用文です。引用文です。</blockquote> <h4>箇条書きリスト h4</h4> <ul> <li>項目1</li> <li>項目2</li> <li>項目2</li> </ul> <h4>番号リスト h4</h4> <ol> <li>項目1</li> <li>項目2</li> <li>項目2</li> </ol> <h4>定義リスト h4</h4> <dl><dt>用語1</dt><dd>定義1</dd><dt>定義2</dt><dd>定義2</dd><dt>定義3</dt><dd>定義3</dd></dl> <h4>コード、<pre> h4</h4> <pre>/*pre内に記述(改行なくなるので、codeタグ使用しない)*/ blockquote { margin: 1em; border: 1px dotted #CCC; } </pre>
主要タグサンプル h3
見出し4 h4
h5 と h6 は、h4と見分け付かないので使わない。
見出し5 h5
見出し6 h6
段落 p です。見たまま編集で改行すると、p要素で括られます。ただ単に改行<br />したい場合は、シフトキーを押しならがら改行します。文中の引用です。クォートで括られます。
段落の上下には、空き(マージン)ができます。
編集画面のHTML編集で、ソース中の空行は削除されます。
太字strongです。太字bです。
引用文です。引用文です。引用文です。引用文です。引用文です。
箇条書きリスト h4
- 項目1
- 項目2
- 項目2
番号リスト h4
- 項目1
- 項目2
- 項目2
定義リスト h4
- 用語1
- 定義1
- 定義2
- 定義2
- 定義3
- 定義3
コード、<pre> h4
/*pre内に記述(改行なくなるので、codeタグ使用しない)*/ blockquote { margin: 1em; border: 1px dotted #CCC; }
セクション
セクション内の見出しです section > h1
セクション内は特にデザイン反映されないので使わない。 p