ブロック1

スマートフォン・タブレット・パソコンでの閲覧に対応した、レスポンシブ Web デザインの無料テンプレートです。

無料テンプレートのダウンロードはこちらから行ってください。

利用規約はこちらからご確認ください。

この文章は、デザインを確認するためのサンプルテキストです。

この文章は、デザインを確認するためのサンプルテキストです。この文章は、デザインを確認するためのサンプルテキストです。

この文章は、デザインを確認するためのサンプルテキストです。この文章は、デザインを確認するためのサンプルテキストです。この文章は、デザインを確認するためのサンプルテキストです。

この文章は、デザインを確認するためのサンプルテキストです。この文章は、デザインを確認するためのサンプルテキストです。この文章は、デザインを確認するためのサンプルテキストです。この文章は、デザインを確認するためのサンプルテキストです。

この文章は、デザインを確認するためのサンプルテキストです。この文章は、デザインを確認するためのサンプルテキストです。この文章は、デザインを確認するためのサンプルテキストです。この文章は、デザインを確認するためのサンプルテキストです。この文章は、デザインを確認するためのサンプルテキストです。

ブロック2

<!-- block START --> から <!-- block END --> をコピーすることで、ブロックはいくつでも増やせます。ブロックを増やすと、空白と線でコンテンツが区切られます。ブロックは複数ではなく、1つでも構いません。

本文のリンクカラーは、css ファイルの article a:link(未訪問のリンクカラー)と article a:visited(訪問済みのリンクカラー)で設定します。

class font_design1 は太字です。<p class="font_design1"> とすると、その段落は太字になります。

段落の途中に適用する場合は、<span class="font_design1">太字にするテキスト</span> となります。

class font_design2 は赤色のテキストです。変更したい場合は、css ファイルを編集してください。

※class supplement は補足用です。フォントサイズは小さく、カラーは灰色に設定されています。同じく css ファイルから変更できます。

サンプル写真

画像も通常通り配置できます。

  • この文章は、デザインを確認するためのサンプルテキストです。
  • この文章は、デザインを確認するためのサンプルテキストです。
  • この文章は、デザインを確認するためのサンプルテキストです。
  • この文章は、デザインを確認するためのサンプルテキストです。
  • この文章は、デザインを確認するためのサンプルテキストです。

ul は、順序なしのリストです。

  1. この文章は、デザインを確認するためのサンプルテキストです。
  2. この文章は、デザインを確認するためのサンプルテキストです。
  3. この文章は、デザインを確認するためのサンプルテキストです。
  4. この文章は、デザインを確認するためのサンプルテキストです。
  5. この文章は、デザインを確認するためのサンプルテキストです。

ol は、順序ありのリストです。どちらも class list_design で整います。

テキストは、均等割付(文章の右端も揃える)になっています。不都合な場合は、css ファイルの「text-align: justify; /* 均等割付 */」と「text-justify: inter-ideograph; /* 均等割付 */」の2行を削除してください。

トップへ戻る