今回は”見出しの色変更”です。
デザインはそのまま使って
色を変える方法について書きます。
この方法を使うと、
見出しだけではなく、
囲み枠や枠内の背景色も
変更できますよ![ウインク](https://stat100.ameba.jp/blog/ucs/img/char/char3/004.png)
![ウインク](https://stat100.ameba.jp/blog/ucs/img/char/char3/004.png)
それでは、行きます。
①使いたいデザインのソースをコピペする
わかりやすい見出し
<div style="border-left: 10px solid #ffa3d1; border-bottom: 2px solid #ffa3d1; padding-left: 10px; font-weight: bold; font-size: 100%; color: #000000;">わかりやすい見出し</div>
赤字がカラーコードです。
②赤文字を好きな色のカラーコードに変更する
わかりやすい見出し
<div style="border-left: 10px solid #008000; border-bottom: 2px solid #ffa500; padding-left: 10px; font-weight: bold; font-size: 100%; color: #000000;">わかりやすい見出し</div>
縦線を緑、横線をオレンジにする場合、
最初の#ffa3d1を#008000、
二番目の#ffa3d1を#ffa500
に修正すると、色が変わります。
ちなみに、カラーコードは
下記のサイトを参照ください![ラブ](https://stat100.ameba.jp/blog/ucs/img/char/char3/006.png)
![ラブ](https://stat100.ameba.jp/blog/ucs/img/char/char3/006.png)