フォントの大きさを変える

※今度こそコピペでそのまま使えるようになりました。

<p class="f08em">※今度こそコピペでそのまま使えるようになりました。</p>


文字の大きさは数字を変えて調節してください。

<p class="f14em">文字の大きさは←の数字を変えて調節してください。</p>


数字は08から30まで使えます。

<p class="f30em">数字は08から30まで使えます。</p>



段落や文字も装飾できます

本来は写真などの画像を装飾するタグですが

<p class="shadow">本来は写真などの画像を装飾するタグですが</p>


実は文章の装飾にも使えます。

<p class="shadow02">実は文章の装飾にも使えます。</p>


pを使えば、段落を装飾します。
段落なので改行すれば広い四角の図形みたくなります。

<p class="outline">pを使えば、段落を装飾します。
段落なので改行すれば広い四角の図形みたくなります。</p>


段落全体ではなく、文字の一部分だけを装飾するときは

<p class="frame">段落全体ではなく、文字の一部分だけを装飾するときは</p>


pではなくspanを使用すればOKです。

<span class="border">pではなくspanを使用すれば</span>OKです。



余白を調整する(内側)

ある範囲(この場合は文字を囲む四角)の内側の余白を調整するときはmを使います。

<span class="m10">ある範囲(この場合は文字を囲む四角)の内側の余白を調整するときはmを使います。</span>


数字を変えると余白の幅が変わります。

<span class="m50">数字を変えると余白の幅が変わります。</span>

数字は0から300までで、大きくなるほど余白が広くなります。

<span class="m20">数字は0から300までで、大きくなるほど余白が広くなります。</span>

余白を調整する(外側)

ある範囲(この場合は文字を囲む四角)の外側の余白を調整するときはpを使います。

<span class="p10">ある範囲(この場合は文字を囲む四角)の外側の余白を調整するときはpを使います。</span>


数字を変えると余白の幅が変わります。

<span class="p50">数字を変えると余白の幅が変わります。</span>


数字は0から300までで、大きくなるほど余白が広くなります。

<span class="p20">数字は0から300までで、大きくなるほど余白が広くなります。</span>


行間の広さを変える

行間の広さを変えてみましょう。
行と行の間の広さのことです。
この広さは文章の読みやすさと直結します。

<p class="lh10">行間の広さを変えてみましょう。
行と行の間の広さのことです。
この広さは文章の読みやすさと直結します。</p>


とはいえ、感じ方は見た人によって
千差万別というのが正直なところ。
10から20の中で、自分が読みやすいと思える数字を入れましょう。

<p class="lh20">とはいえ、感じ方は見た人によって
千差万別というのが正直なところ。
10から20の中で、自分が読みやすいと思える数字を入れましょう。</p>


段落の横幅を変える

段落の横幅も変えることができます。
ある程度の幅にして、改行ではなく紙面に書くような文章の書き方をするとあまり横に広がらず読みやすいかもしれませんね。ちなみに今は50に設定しています。

<p class="w50">段落の横幅も変えることができます。
ある程度の幅にして、改行ではなく紙面に書くような文章の書き方をするとあまり横に広がらず読みやすいかもしれませんね。ちなみに今は50に設定しています。</p>


数字はパーセンテージです。本来の横幅(カラムの幅)に対するパーセンテージなので、0と100以上はありません。賢威では05から5刻みで100まで設定することができます。ちなみに今は65に設定しています。

<p class="w65">数字はパーセンテージです。本来の横幅(カラムの幅)に対するパーセンテージなので、0と100以上はありません。賢威では05から5刻みで100まで設定することができます。ちなみに今は65に設定しています。</p>


05の使い方って何でしょうね???

<p class="w05">05の使い方って何でしょうね???</p>


まとめ

賢威のcssに設定されている装飾タグは以上になるかと思います、たぶん。

このほかにもいろいろなタグが世の中にはあるので、
気に入ったものがあればご自分で設定してみると差別化が図れますね。

そのときは必ずもともとのcssをメモ帳などに全文コピペして、
万が一ミスをしたときのためにバックアップとして残しておきましょう。

賢威装飾タグその1
賢威装飾タグその2


物販アフィリエイトなら⇒LUREA plus
情報発信アフィリエイトなら⇒アンリミテッドアフィリエイト ネオ
勝手にSEOに強くなるWPテンプレート⇒賢威7
超簡単カスタマイズのWPテンプレート⇒ALPHA WordPress Theme