カラーコードで囲み枠と背景の色を変更する方法

 

こんにちは、ゆめ花です。

今日は、
カラーコードでワードプレス記事に入れる
囲み枠と囲み枠内背景の
色を自由に変更する方法のご紹介です。

 

記事を書いていて囲み枠が欲しくてグーグルで調べた時に
あっ!!この枠いいな~って思っても
色がちょっと・・・。という見本の囲み枠ってないですか?
色さえ自分の好みだったらなぁ~って事。

 

そんな時のために
カラーコードを使って色を自由に変更する流れを
動画にしてみました。

では、どうぞ。

 

囲み枠コードURL
<div style=”border: 10px double #ff3399; padding: 10px; background: #ffffff;”>文章を入れる</div>

 

上の囲み枠をコピーしてテキストからペーストします。

 

 

貼り付けたらビジュアルで開くとこうなります。

この囲み枠ができます。

次に囲み枠の色を変更してみましょう。

 

カラーコードURL http://www.finitojapan.com/cltable.html

上のカラーコードの中から
あなたの好きな色を#からコピーして

 

赤い枠の中のコードを消して上からペーストします。

気を付けてほしいのは #ff3399; この記号の右端の;の部分を
消してしまうと囲み枠が崩れてしまうので注意してくださいね。

コードを変更したら、ビジュアルにして見てみましょう。

 

 

無事に色が変わりましたね。

では、次に枠の中の背景にも色を付けてみましょう。

 

今度はこちらのコードをテキストから変更します。

 

この時も;の部分を消さないように気を付けてくださいね。

 

さあ!出来ました。

 

 

お疲れ様でした。^^

 

いかがでしたか?

気に入った囲み枠が見つかったら
お好きな色に変更して
あなたらしい雰囲気のブログ記事つくりに
お役立てください。

最後までお読み下さりありがとうございました。

メルマガ・アフィリエイトランキング

ブログランキング・にほんブログ村へ
にほんブログ村

コメントを残す

このページの先頭へ