h2見出しテキストテキストテキストテキストテキストテキスト
h3見出しテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキスト
h4見出しテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキスト
h5見出しテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキスト
h6見出しテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキスト
- リスト
- リスト
- リスト
- リスト
- リスト
- リスト
- リスト
- リスト
- リスト
- リスト
- リスト
- リスト
テーブルです | |
---|---|
aaa | |
bbb | |
ccc |
blockquote引用文用です
仕上がりが崩れていないか確認しながらご利用ください。
↓↓↓↓↓↓
別ウィンドウで開くアイコンを出したくない場合は、aタグに class=”noExternal”をつけてください。(例:画像にリンクをはったら「別ウィンドウで開くアイコンが自動で出てきてしまった時」等)
■画像左配置テキスト回り込み(スマートフォンで回り込み解除、画像は中央に配置)
テキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキスト
テキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキスト
※ポイント※画像左配置・右配置を使ったら、余白次第で次の項目も回り込んでしまいます。回り込みたくない場合は、次の要素に class=”clear” をつけてください。(上の「画像右配置テキスト回り込み(スマートフォンで回り込み解除、画像は中央に配置)」についています)
もしくは、回り込みをしている部分を
で囲うことで下の要素が回り込むのを防ぐことができます。
↓「リスト」を横並びにしたい場合お使いください。
※リスト用です。リストとして縦に並んだものを、下記のように横並びにしたい時に使用。リストではない関連性のないボックスを横並びにしたい場合は後述のflexBoxを使用
float2col1
- テキストテキスト
- テキストテキスト
- テキストテキスト
- テキストテキスト
- テキストテキスト
float3col1
- テキストテキスト
- テキストテキスト
- テキストテキスト
- テキストテキスト
- テキストテキスト
- テキストテキスト
- テキストテキスト
- テキストテキスト
float4col1
- テキストテキスト
- テキストテキスト
- テキストテキスト
- テキストテキスト
- テキストテキスト
- テキストテキスト
- テキストテキスト
- テキストテキスト
float4col2
- テキストテキスト
- テキストテキスト
- テキストテキスト
- テキストテキスト
- テキストテキスト
- テキストテキスト
- テキストテキスト
- テキストテキスト
■flexBox1 左右50%
■flexBox2 左260px
■flexBox3 右260px
■flexBox4 均等3つ並び
■pageLinkList1 3つ並び
■pageLinkList2 2つ並び
■アンカーリンクをする場合は、リンク先を
<div class="anchor clearfix" id="ここにID">ここにコンテンツ</div>
で囲ってください。
そうしないとヘッダ固定分のずれが生じます。