賢威6.1で使える装飾タグを一挙紹介
賢威には、自分でCSSを書いて登録したり、HTMLで複雑なタグを打つ必要がないように、かなり豊富な種類の装飾タグがあらかじめ用意されています。豊富すぎて、ちょっと僕も全部は把握していなかったのですが（笑）、せっかくなので一度ちゃんとまとめてみることにしました。
使い方としては、左側の「HTMLの記述方法」の部分をコピペして、中の文字を変更して使ってください。
文字色を変更する場合
| HTMLの記述方法 | ブラウザでの表示結果 |
|---|---|
| <span class=”black”>文字を黒くする</span> | 文字を黒くする |
| <span class=”blue”>文字を青くする</span> | 文字を青くする |
| <span class=”red”>文字を赤くする</span> | 文字を赤くする |
| <span class=”green”>文字を緑にする</span> | 文字を緑にする |
| <span class=”yellow”>文字を黄色にする</span> | 文字を黄色にする |
| <span class=”navy”>文字を紺色にする</span> | |
| <span class=”gray”>文字を灰色にする</span> | 文字を灰色にする |
| <span class=”orange”>文字をオレンジにする</span> | 文字をオレンジにする |
| <span class=”pink”>文字をピンク色にする</span> | 文字をピンク色にする |
| <span class=”purple”>文字を紫にする</span> | 文字を紫にする |
| <span class=”olive”>文字を黄土色にする</span> | 文字を黄土色にする |
| <span class=”lime”>文字を黄緑にする</span> | 文字を黄緑にする |
| <span class=”aqua”>文字を水色にする</span> | 文字を水色にする |
文字の大きさを変更する場合
| HTMLの記述方法 | ブラウザでの表示結果 |
|---|---|
| <span class=”b”>文字を太くする</span> | 文字を太くする |
| <span class=”f08em”>文字を80％の大きさにする</span> | 文字を80％の大きさにする |
| <span class=”f12em”>文字を120％の大きさにする</span> | 文字を120％の大きさにする |
| <span class=”f15em”>文字を150％の大きさにする</span> | 文字を150％の大きさにする |
| <span class=”f18em”>文字を180％の大きさにする</span> | 文字を180％の大きさにする |
文字に下線や取り消し線をひく場合
| HTMLの記述方法 | ブラウザでの表示結果 |
|---|---|
| <span class=”underline”>文字に下線を引く</span> | 文字に下線を引く |
| <span class=”del”>文字に取り消し線を引く</span> | 文字に取り消し線を引く |
文字列に蛍光ペンを引く
| HTMLの記述方法 | ブラウザでの表示結果 |
|---|---|
| <span class=”box-yellow”>黄色い蛍光ペンを引く</span> | 黄色い蛍光ペンを引く |
| <span class=”box-aqua”>水色の蛍光ペンを引く</span> | 水色の蛍光ペンを引く |
| <span class=”box-gray”>灰色の蛍光ペンを引く</span> | 灰色の蛍光ペンを引く |
| <span class=”box-red”>赤色の蛍光ペンを引く</span> | 赤色の蛍光ペンを引く |
文字をアイコンで目立たせる場合
| HTMLの記述方法 | ブラウザでの表示結果 |
|---|---|
| <p class=”caution1″>CHECKのポップを表示</p> |
CHECKのポップを表示 |
| <p class=”caution2″>CHECKのポップを表示</p> |
CHECKのポップを表示 |
| <p class=”caution3″>POINTのポップを表示</p> |
POINTのポップを表示 |
| <p class=”caution4″>POINTのポップを表示</p> |
POINTのポップを表示 |
| <p class=”caution5″>CHECKのポップを表示</p> |
CHECKのポップを表示 |
| <p class=”caution6″>POINTのポップを表示</p> |
POINTのポップを表示 |
| <p class=”caution7″>注意のポップを表示</p> |
注意のポップを表示 |
| <p class=”caution8″>注意のポップを表示</p> |
注意のポップを表示 |
| <p class=”wakaba”>初心者のアイコンを表示</p> |
初心者のアイコンを表示 |
| <p class=”mail”>メールのアイコンを表示</p> |
メールのアイコンを表示 |
チェックリスト項目を作る場合
| HTMLの記述方法 | ブラウザでの表示結果 |
|---|---|
|
<ul class=”checklist”> <li>チェックリスト</li> <li>チェックリスト</li> <li>チェックリスト</li> </ul> |
|
商品のランキングを作る場合
| HTMLの記述方法 | ブラウザでの表示結果 |
|---|---|
|
<ul class=”ranking”> <li class=”no01″> <p class=”item-name”>商品名１</p> </li> <li class=”no02″> <p class=”item-name”>商品名２</p> </li> <li class=”no03″> <p class=”item-name”>商品名３</p> </li> <li class=”no04″> <p class=”item-name”>商品名４</p> </li> <li class=”no05″> < class=”item-name”>商品名５</p> </li> </ul> |
|
賢威は数多くのアフィリエイターやブロガーに長年に渡って支持され続けているSEO対策済テンプレートです。
WordPressでブログを運営している方で、本気でアクセスアップやSEO対策を狙っているなら、間違いなくお勧めです。
以下の記事で賢威の特徴や魅力について詳しく解説していますので良かったらご覧ください。豪華な特典のプレゼントもあります。
以下の記事で賢威の特徴や魅力について詳しく解説していますので良かったらご覧ください。豪華な特典のプレゼントもあります。
賢威がアフィリエイターに選ばれる理由 当サイト限定の賢威の購入特典はこちら
最近のコメント