いつもなら賢威がバージョンアップされるたびに装飾タグ一覧を投稿してくださるブロガーさんがいらっしゃって助かるのですが、(賢威7が変更箇所が多く賢威6.2のままなのか)いつになっても投稿してくださる方がいらっしゃらないので、他力本願じゃダメだと思い作ってみました。

賢威7.0ビューティー版の表示です。タグの記述方法は同じだと思いますが、コーポレート版・プリティ版・クール版ではアイコンおよび表示が変わる可能性があります。

文字色

肯定

HTMLの記述方法 ブラウザでの表示結果
文字色を紺色
文字色を水色

否定・禁止

HTMLの記述方法 ブラウザでの表示結果
文字色を赤色

シンプルな強調

HTMLの記述方法 ブラウザでの表示結果
文字色をオレンジ色
文字色をピンク色
文字色を紫色

用語の解説・例示

HTMLの記述方法 ブラウザでの表示結果
文字色を緑色

その他の色

HTMLの記述方法 ブラウザでの表示結果
文字色を青色
文字色を黄色
文字色をオリーブ色
文字色をライム色
文字色を黒色
文字色を灰色
文字色を白色変更可能
文字色を茶色

マーカー表示

HTMLの記述方法 ブラウザでの表示結果
オレンジ色の背景色
ピンク色の背景色
黄色の背景色
ライム色の背景色
灰色の背景色

テキストの表現

リスト

ul要素

  • リストが入ります。
  • リストが入ります。長めのリストはこのようなデザインになります。長めのリストはこのようなデザインになります。長めのリストはこのようなデザインになります。

ol要素

  1. リストが入ります。
  2. リストが入ります。

横並び

リストを横並びにして表示します。

  • リストが入ります。
  • リストが入ります。

リストの先頭に表示するマーカー文字を非表示

  • リストが入ります。
  • リストが入ります。

記述リスト(旧定義リスト)

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

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

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

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

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

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

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

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

連続改行

↓5つ連続した改行を入れます。






↑5つ連続した改行をいれました。

「br num=”x”」のxに数字をいれると、数字の数だけ改行が入ります。

注意書き

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

傍点

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

整形済みテキスト

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

インラインの装飾

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

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

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

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

abbr要素: HTML等の略語

透過ボックス

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

WordPress版のimageフォルダには画像が入っていないため、html版をDLして”transparent-panel-bg2.jpg”をimageフォルダにアップロードする必要があります。

テーブルレイアウト

標準のテーブル

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

比較用テーブル

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

引用エリア

blockquote要素

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

q要素

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

チェックリスト

小さなチェックリスト

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

大きなチェックリスト

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

アイコンセット

小さなアイコン

HTMLの記述方法 ブラウザでの表示結果

ポイント

注意

NEW

初心者

別ウインドウ

矢印上

矢印右

矢印下

矢印左

ダウンロード

PDF

ZIP

メール

ショッピングカート

ホーム

フォルダ

時計

カレンダー

ビル

マップ

大きなアイコン

HTMLの記述方法 ブラウザでの表示結果

ポイント

注意

NEW

初心者

別ウインドウ

矢印上

矢印右

矢印下

矢印左

ダウンロード

PDF

ZIP

メール

ショッピングカート

虫眼鏡

ホーム

フォルダ

時計

カレンダー

ビル

マップ

コンバージョンボタン