Company Name

サイトのディスクリプション、またはキャッチコピーなどを記入してください。
Tel. 00-0000-0000
コンテンツイメージ画像
Home > コンテンツ(パンくず)

テンプレートについて(コンテンツページタイトル)

このテンプレートのレイアウト用 CSS は、common フォルダの中に style.css という名前で保存されております。CSSには、大まかな要素ごとにコメントを入れておりますので、箇所の特定はしやすいと思います。お好みに合わせて設定を変更してください。

基本的な要素について(見出し2)

写真を左に本文の文字サイズは100%に指定し、行間は少し広めに設定しています。文字サイズ100%とはどういうことかというと、ブラウザの基本設定に合わせているということです。ブラウザの基本設定で大きめに設定している方は文字が大きく見えるし、小さく設定している方には小さく見えることになります。

段落の上下のアキは10pxを指定しています。また段落には一文字落ちのインデントを指定しています。リンクのカラーは、テーマカラーに合わせた同系色で指定しています。

画像の配置(見出し2)

写真を右に本文に画像を設置する場合は、回り込みの指定ができます。画像を右側に配置したい場合は class="alignright" を指定、左側に配置したい場合は class="alignleft" を指定してください。いずれの指定もしない場合は回り込みは行われず、画像が左側に配置されその右側は余白となります。画像を中央に配置したい場合は class="aligncenter" を指定してください。大きな画像を配置する場合はこれが便利かもしれませんね。

また、画像と次のタイトルが重なった場合はそのまま回り込みますが、画像の回り込みをタイトルで区切りたい場合は clear の指定をしてください。詳しくはスタイルシートにコメントで記載していますのでご覧ください。

写真を中央に配置した場合はこんな感じです。

リストの指定

本文でリストを指定した場合の見本です。

  • HTML5+CSS3で構成されたシンプルな仕上がり
  • 大きめメニューのインターフェイス!
  • 左メニューのオーソドックスなレイアウト
  • レッドを基調にしたインパクトのあるイメージ

箇条書きなどはリストで表記されるのが好ましいとされます。箇条書きなどがある場合は、この部分をコピーしてお使いください。

▲このページのトップへ