表示サンプル（賢威） | 布団毛布クリーニング.com

文字色

肯定

文字色を紺色に変更することができます。

文字色を水色に変更することができます。

否定・禁止

文字色を赤色に変更することができます。

シンプルな強調

文字色をオレンジ色に変更することができます。

文字色をピンク色に変更することができます。

文字色を紫色に変更することができます。

用語の解説・例示

文字色を緑色に変更することができます。

その他の色

文字色を青色に変更することができます。

文字色を黄色に変更することができます。

文字色をオリーブ色に変更することができます。

文字色をライム色に変更することができます。

文字色を黒色に変更することができます。

文字色を灰色に変更することができます。

文字色を白色に変更することができます。

文字色を茶色に変更することができます。

マーカー表示

文字にオレンジ色の背景色をつけることができます。

文字にピンク色の背景色をつけることができます。

文字に黄色の背景色をつけることができます。

文字にライム色の背景色をつけることができます。

文字に灰色の背景色をつけることができます。

テキストの表現

記述リスト（旧定義リスト）

「定義リスト（definition list）」は、html5では「記述リスト（description list）」と改められました。

dt要素: dd要素dd要素dd要素dd要素

定義リストとして使用する場合

dt要素とdfn要素で用語をマークアップ: dd要素に定義を記述します。

記述リストのデザインその1

記述リストのデザインその1: 要素が横に並びます。モバイルなどでは、横並びが解除されます。また
左よりも右の文字数の方が少なくなるとデザインが崩れます。
記述リストのデザインその1: 要素が横に並びます。モバイルなどでは、横並びが解除されます。また
左よりも右の文字数の方が少なくなるとデザインが崩れます。
記述リストのデザインその1: 要素が横に並びます。モバイルなどでは、横並びが解除されます。また
左よりも右の文字数の方が少なくなるとデザインが崩れます。

記述リストのデザインその2

記述リストのデザインその2: 要素が縦に並びます。
記述リストのデザインその2: 要素が縦に並びます。
記述リストのデザインその2: 要素が縦に並びます。

注意書き

※注釈・注記です。最初の一文字だけ飛び出て、それ以降の文字がぶら下がります。注釈・注記です。最初の一文字だけ飛び出て、それ以降の文字がぶら下がります。注釈・注記です。最初の一文字だけ飛び出て、それ以降の文字がぶら下がります。

傍点

テキスト上に傍点を打ちます。

整形済みテキスト

整形済みテキストです。コードなどを記述する場合は以下のようにcode要素でマークアップします。
<code>コード</code>

インラインの装飾

em要素: 強勢する（アクセントを付ける）箇所を表す

strong要素: 強い重要性を表す

small要素: 免責・警告・著作権などの注釈や細目を表す

s要素: ~~すでに正確ではなくなった内容を表す~~テキストが入ります。

abbr要素: HTML等の略語

透過ボックス

サイトをリニューアルしました。サイトをリニューアルしました。サイトをリニューアルしました。サイトをリニューアルしました。

テーブルレイアウト

標準のテーブル

	項目名	項目名
項目名が入ります	項目内容	項目内容
項目名が入ります	項目内容	項目内容
項目名が入ります	項目内容	項目内容

比較用テーブル

	項目内容	項目内容	項目内容
項目名が入ります	項目内容	項目内容	項目内容
項目名が入ります	項目内容	項目内容	項目内容
項目名が入ります	項目内容	項目内容	項目内容
項目名が入ります	項目内容	項目内容	項目内容

引用エリア

blockquote要素

ここに引用文が入ります。ここに引用文が入ります。ここに引用文が入ります。ここに引用文が入ります。ここに引用文が入ります。
ここに引用文が入ります。ここに引用文が入ります。ここに引用文が入ります。ここに引用文が入ります。ここに引用文が入ります。
ここに引用文が入ります。ここに引用文が入ります。ここに引用文が入ります。ここに引用文が入ります。ここに引用文が入ります。
ここに引用文が入ります。ここに引用文が入ります。

引用元: 参照記事のタイトル

q要素

ここにテキストが入りますここにテキストが入りますここにテキストが入りますここにテキストが入りますここにテキストが入りますここにテキストが入ります。
ここにテキストが入りますここにテキストが入ります。
ここにテキストが入ります文中に出てくる短文の引用部分への装飾ですここにテキストが入りますここにテキストが入りますここにテキストが入りますここにテキストが入りますここにテキストが入ります。

チェックリスト

小さなチェックリスト

チェックリストの項目が入ります。チェックリストの項目が入ります。
チェックリストの項目が入ります。チェックリストの項目が入ります。チェックリストの項目が入ります。チェックリストの項目が入ります。チェックリストの項目が入ります。チェックリストの項目が入ります。
チェックリストの項目が入ります。チェックリストの項目が入ります。
チェックリストの項目が入ります。チェックリストの項目が入ります。
チェックリストの項目が入ります。チェックリストの項目が入ります。

大きなチェックリスト

チェックリストの項目が入ります。チェックリストの項目が入ります。
チェックリストの項目が入ります。チェックリストの項目が入ります。チェックリストの項目が入ります。チェックリストの項目が入ります。チェックリストの項目が入ります。チェックリストの項目が入ります。
チェックリストの項目が入ります。チェックリストの項目が入ります。
チェックリストの項目が入ります。チェックリストの項目が入ります。
チェックリストの項目が入ります。チェックリストの項目が入ります。

価格	5.0
使用感	3.5
効果	4.0

価格	5.0
使用感	3.5
効果	4.0

価格	5.0
使用感	3.5
効果	4.0

価格	5.0
使用感	3.5
効果	4.0

価格	5.0
使用感	3.5
効果	4.0

価格	5.0
使用感	3.5
効果	4.0

小さなアイコン

ポイント

注意

NEW

初心者

別ウインドウ

矢印上

矢印右

矢印下

矢印左

ダウンロード

PDF

ZIP

メール

ショッピングカート

虫眼鏡

ホーム

フォルダ

時計

カレンダー

ビル

マップ

大きなアイコン

ポイント

注意

NEW

初心者

別ウインドウ

矢印上

矢印右

矢印下

矢印左

ダウンロード

PDF

ZIP

メール

ショッピングカート

虫眼鏡

ホーム

フォルダ

時計

カレンダー

ビル

マップ

多段カラム

4カラム

テキストが入ります。

3カラム

テキストが入ります。

2カラム

テキストが入ります。

画像とテキストの組み合わせ

画像の上にテキストを配置

テキスト

テキスト

テキスト

背景画像の上にテキストを配置

テキストが入りますテキストが入りますテキストが入りますテキストが入ります

Q&A

ここには質問文が入ります。: ここには回答文が入りますここには回答文が入りますここには回答文が入ります。
ここには回答文が入ります。
ここには回答文が入りますここには回答文が入りますここには回答文が入りますここには回答文が入ります。
ここには質問文が入ります。: ここには回答文が入りますここには回答文が入りますここには回答文が入ります。
ここには回答文が入ります。
ここには回答文が入りますここには回答文が入りますここには回答文が入りますここには回答文が入ります。

フロー図

手続きの流れに関する文章が入ります

流れに関する詳細文章が入ります。流れに関する詳細文章が入ります。流れに関する詳細文章が入ります。流れに関する詳細文章が入ります。
手続きの流れに関する文章が入ります

流れに関する詳細文章が入ります。流れに関する詳細文章が入ります。流れに関する詳細文章が入ります。流れに関する詳細文章が入ります。
手続きの流れに関する文章が入ります

画像の装飾

登場人物紹介

登場人物Ａ: ここに紹介文が入ります。ここに紹介文が入ります。ここに紹介文が入ります。ここに紹介文が入ります。ここに紹介文が入ります。

登場人物Ｂ: ここに紹介文が入ります。ここに紹介文が入ります。ここに紹介文が入ります。ここに紹介文が入ります。ここに紹介文が入ります。

登場人物Ｃ: ここに紹介文が入ります。ここに紹介文が入ります。ここに紹介文が入ります。ここに紹介文が入ります。ここに紹介文が入ります。