スタイルガイド

テキストと画像を並べるスタイル

左側に画像

pタグのテキスト：サンプルテキストサンプルテキストサンプルテキストサンプルテキストリンクをはりつける場合のスタイル。：hoverすると0.3秒かけて色が変わるサンプルテキストサンプルテキストサンプルテキスト bタグで文字を太く サンプルテキストサンプルテキストサンプルテキストサンプルテキスト strongタグはhtml5では文章として大事な部分を指します サンプルテキストサンプルテキストサンプルテキストサンプルテキストサンプルテキストサンプルテキストサンプルテキストサンプルテキストサンプルテキストサンプルテキストサンプルテキストサンプルテキストサンプルテキストサンプルテキストサンプルテキストサンプルテキスト

右側に画像

中央に画像

リストのスタイル

通常のリスト（ul）

サンプルテキスト
サンプルテキスト
サンプルテキスト
サンプルテキスト

矢印付きリスト（ul.list-arrow）

サンプルテキスト
サンプルテキスト
サンプルテキスト
サンプルテキスト

番号付きリスト(ol>li)

サンプルテキスト
サンプルテキスト
サンプルテキスト
サンプルテキスト

名前付き定義リストのスタイル

dl,dt,ddのデフォルト: サンプルテキスト
サンプル: サンプルテキスト
サンプル: サンプルテキスト
サンプル: サンプルテキスト

略歴などの場合: dl => .ryaku を着ける
昭和60年5月: サンプルテキスト
サンプルテキスト
昭和60年5月: サンプルテキスト
昭和60年5月: サンプルテキスト
昭和60年5月: サンプルテキスト

質問などのコンテンツを入れる場合: dl => .faq を着ける
質問: サンプルテキスト
質問: サンプルテキスト

テキストに枠を付けるスタイル

コンテンツに色を付けたい場合はdiv.classで括ってからpタグを挿れる
サンプルテキストサンプルテキストサンプルテキストサンプルテキストサンプルテキストサンプルテキストサンプルテキストサンプルテキストサンプルテキストサンプルテキストサンプルテキストサンプルテキストサンプルテキストサンプルテキストサンプルテキストサンプルテキストサンプルテキストサンプルテキストサンプルテキストサンプルテキストサンプルテキストサンプルテキストサンプルテキストサンプルテキストサンプルテキストサンプルテキストサンプルテキストサンプルテキストサンプルテキストサンプルテキストサンプルテキストサンプルテキストサンプルテキスト

テーブルのスタイル

診療時間表のスタイル

診療時間	月	火	水	木	金	土	日・祝
9:00〜12:30	●	●	●	ー	●	●	ー
15:00〜18:30	●	●	●	ー	●	ー	ー

見出しのスタイル h2

見出しのスタイル h3

見出しのスタイル h4

見出しのスタイル h5

ボタンのスタイル

◯◯について詳しくはこちら

テキストのとなりに入れるとこんなかんじ◯◯について詳しくはこちら

ページ内リンクのスタイル