Warning: count(): Parameter must be an array or an object that implements Countable in /home/c2847790/public_html/noda-information.com/wp-includes/post-template.php on line 284
0
2017年7月3日 08:33
投稿ノウハウ, 魅力発信

投稿HTML書式集

記事投稿をする際のHTML書式集

記事投稿をする際に、見出しはどうすればできるのか？表組はどうする？　こんな悩みはこのページを読めば解決します。

読みやすさと美しさにこだわったタイトル

記述例：<h1>読みやすさと美しさにこだわったタイトル</h1>

記事の最初に書くのがタイトル、大きさや演出なども記事投稿のテクニックです。

読みやすさと美しさにこだわったタイトル

記述例：<h2>読みやすさと美しさにこだわったタイトル</h2>

記事の最初に書くのがタイトル、大きさや演出なども記事投稿のテクニックです。

読みやすさと美しさにこだわったタイトル

記述例：<h3>読みやすさと美しさにこだわったタイトル</h3>

記事の最初に書くのがタイトル、大きさや演出なども記事投稿のテクニックです。

読みやすさと美しさにこだわったタイトル

記述例：<h4>読みやすさと美しさにこだわったタイトル</h4>

記事の最初に書くのがタイトル、大きさや演出なども記事投稿のテクニックです。

読みやすさと美しさにこだわったタイトル
記述例：<h5>読みやすさと美しさにこだわったタイトル</h5>

記事の最初に書くのがタイトル、大きさや演出なども記事投稿のテクニックです。

読みやすさと美しさにこだわったタイトル
記述例：<h6>読みやすさと美しさにこだわったタイトル</h6>

記事の最初に書くのがタイトル、大きさや演出なども記事投稿のテクニックです。

引用 (Blockquote) テスト

一行の引用。

ハングリーであれ、愚かであれ。

記述例：<blockquote>ハングリーであれ、愚かであれ。</blockquote>

cite 参照を含む複数行の引用。

これは言語みたいなものだ。アルファベットすなわち音階を学び、文すなわちコードを学ぶ。そしてやがてホーンと即興で会話するようになる。即興で話すのはすばらしいことだと思うが、私には決して会得できないだろう。しかし音楽ともなれば、私は即座によろこんで会話する。そう、それがジャズ音楽のすべてだ。

スタン・ゲッツ

記述例：
<blockquote>これは言語みたいなものだ。アルファベットすなわち音階を学び、文すなわちコードを学ぶ。そしてやがてホーンと即興で会話するようになる。即興で話すのはすばらしいことだと思うが、私には決して会得できないだろう。しかし音楽ともなれば、私は即座によろこんで会話する。そう、それがジャズ音楽のすべてだ。
<cite>スタン・ゲッツ</cite></blockquote>

テーブル

社員 給料
山田太郎 1ドル スティーブ・ジョブズが必要なサラリーと同じ額。
田中花子 1,000万円 ブログを書くために必要になる資金。
山本次郎 1億円 百聞は一見にしかず、ということで、カメラマンはブロガーの100倍。
中山愛子 10億円 特に理由は要りません。
記述例：
<table>
<thead>
<tr>
<th>社員</th>
<th>給料</th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<th><a href=”http://example.org/”>山田太郎</a></th>
<td>1ドル</td>
<td>スティーブ・ジョブズが必要なサラリーと同じ額。</td>
</tr>
<tr>
<th><a href=”http://example.org/”>田中花子</a></th>
<td>1,000万円</td>
<td>ブログを書くために必要になる資金。</td>
</tr>
<tr>
<th><a href=”http://example.org/”>山本次郎</a></th>
<td>1億円</td>
<td>百聞は一見にしかず、ということで、カメラマンはブロガーの100倍。</td>
</tr>
<tr>
<th><a href=”http://example.org/”>中山愛子</a></th>
<td>10億円</td>
<td>特に理由は要りません。</td>
</tr>
</tbody>
</table>

定義リスト

定義リストタイトル
これは定義リストです。
定義
物事、領域、何かについての意味の正確な文章や説明: 詩を構成するものの定義。
ギャラリー
こんかい導入された、投稿に添付された画像を展示するための機能です。同じように、投稿を編集中にアップロードすると、そのファイルは「投稿に添付」されます。
Gravatar (グラバター)
グラバターとはグローバルに認識されるアバター (あるユーザーを表すグラフィックイメージや写真) です。グラバターはメールアドレスと紐づいていて、Gravatar.com サービスによって管理されています。このサービスを利用すると、ブログ所有者は自分のブログを設定することによりコメント欄にユーザーのグラバターを表示させることができます。
記述例：
<dl>
  <dt>定義リストタイトル</dt>
  <dd>これは定義リストです。</dd>
  <dt>定義</dt>
  <dd>物事、領域、何かについての意味の正確な文章や説明: <em>詩を構成するものの定義。</em></dd>
  <dt>ギャラリー</dt>
  <dd>こんかい導入された、投稿に添付された画像を展示するための機能です。同じように、投稿を編集中にアップロードすると、そのファイルは「投稿に添付」されます。</dd>
  <dt>Gravatar (グラバター)</dt>
  <dd>グラバターとはグローバルに認識されるアバター (あるユーザーを表すグラフィックイメージや写真) です。グラバターはメールアドレスと紐づいていて、Gravatar.com サービスによって管理されています。このサービスを利用すると、ブログ所有者は自分のブログを設定することによりコメント欄にユーザーのグラバターを表示させることができます。</dd>
</dl>

非順序リスト (ネスト化)

  • リスト項目 1
    • リスト項目 1
      • リスト項目 1
      • リスト項目 2
      • リスト項目 3
      • リスト項目 4
    • リスト項目 2
    • リスト項目 3
    • リスト項目 4
  • リスト項目 2
  • リスト項目 3
  • リスト項目 4

順序リスト (ネスト化)

  1. リスト項目 1
    1. リスト項目 1
      1. リスト項目 1
      2. リスト項目 2
      3. リスト項目 3
      4. リスト項目 4
    2. リスト項目 2
    3. リスト項目 3
    4. リスト項目 4
  2. リスト項目 2
  3. リスト項目 3
  4. リスト項目 4
記述例：
<ul>
  <li>リスト項目 1
<ul>
  <li>リスト項目 1
<ul>
  <li>リスト項目 1</li>
  <li>リスト項目 2</li>
  <li>リスト項目 3</li>
  <li>リスト項目 4</li>
</ul>
</li>
  <li>リスト項目 2</li>
  <li>リスト項目 3</li>
  <li>リスト項目 4</li>
</ul>
</li>
  <li>リスト項目 2</li>
  <li>リスト項目 3</li>
  <li>リスト項目 4</li>
</ul>
<h2>順序リスト (ネスト化)</h2>
<ol>
  <li>リスト項目 1
<ol>
  <li>リスト項目 1
<ol>
  <li>リスト項目 1</li>
  <li>リスト項目 2</li>
  <li>リスト項目 3</li>
  <li>リスト項目 4</li>
</ol>
</li>
  <li>リスト項目 2</li>
  <li>リスト項目 3</li>
  <li>リスト項目 4</li>
</ol>
</li>
  <li>リスト項目 2</li>
  <li>リスト項目 3</li>
  <li>リスト項目 4</li>
</ol>

HTML 要素タグテスト

他の HTML タグの参考例です。

住所タグ
以下は住所の例です。<address> タグを使用しています:

〒100-0000東京都千代田区1-1-1日本

anchor タグ (リンク)

記述例：<address>〒100-0000東京都千代田区1-1-1日本</address><strong>anchor タグ (リンク)</strong>

これは <anchor> (もしくはリンクとも呼ばれます) の例です。

abbr タグ
この abbr は文章の中にある <abbr> タグの例です。

記述例：この <abbr title=”abbreviation”>abbr</abbr> は文章の中にある <abbr> タグの例です。


Strong タグ
このタグは太字テキストを表しています。

記述例：このタグは<strong>太字</strong>テキストを表しています。

 

Copyright © 野田情報サイト All Rights Reserved.