BLOG CATEGORY

Monthly Archives

長フチコンテンツ

サイバーアクセル？何者や

サイバーアクセル？<br />何者や
サイバーアクセル？
何者や

ホームページ制作？だからどうした①

ホームページ制作？<br />だからどうした①
ホームページ制作？
だからどうした①

ホームページ制作？だからどうした②

ホームページ制作？<br />だからどうした②
ホームページ制作？
だからどうした②

SEO対策？怪しい話しか聞かないぞ

SEO対策？<span>怪しい話<br />しか聞かないぞ</span>
SEO対策？怪しい話
しか聞かないぞ

集客アドバイザー？よう分からん

集客アドバイザー？<br />よう分からん
集客アドバイザー？
よう分からん

俺なりのまとめを伝える！

俺なりのまとめを伝える！
俺なりのまとめを伝える！

ホームページ制作、SEO対策 サイバーアクセル・アドバイザーズＴＯＰ » ブログ » webコラム» JUGEMブログカスタマイズ　テキスト文字色を変更する方法

このエントリーをはてなブックマークに追加

JUGEMブログカスタマイズ　テキスト文字色を変更する方法

   投稿日: 2017/04/13    投稿者:webコラム

53253188ab4e7460dca89d3fb9c39098_s.jpg

こんにちは！　ライターのモモタロウです。

今回は、JUGEMブログカスタマイズ　ブログの文字色を変更する方法をお伝えします。


ブログタイトルの文字色を変更しよう

まず、ブログタイトルのみ文字色を変更してみます。


JUGEMブログにログインです。

メニューバーから「デザイン」→「HTML・CSS編集」をクリックします。

CSS編集フォームにて、文字色を変更します。

ブログタイトルのみ文字色を変更するには、

CSS編集フォームで、下記の画像の四角で囲った部分を探します。

20170408-2.jpg

/* ブログ名の色 */
h1 a,h1 a:link,h1 a:visited {color:#ff99ff;text-decoration:none;}
h1 a:hover,h1 a:active {color:#000000;text-decoration:none;}

今回は、h1 a,h1 a:link,h1 a:visited {color:#ff99ff;text-decoration:none;}　部分で
「#000000」を「#ff99ff」に変更しよう。

4096 Color Wheel
http://www.ficml.org/jemimap/style/color/wheel.html
上記URLにてカラーコードを検索するとよいでしょう。

「CSSを編集」ボタンをクリックして、ブログを確認すると・・・

20170408-2-1結果.jpg

タイトル部分のみ色を変えることができました。

HTMLテキスト文字全体の色を変更しよう

次に、文字全体を変更してみます。

先ほどの「CSS編集フォーム」で下の画像の四角で囲った部分を探します。
20170408-3全体のフォント変更000000.jpg


先ほどと同じく、「#000000」を「#ff99ff」に変更しよう。

/* ページ全体のテキスト色 */
html {color:#ff99ff;}

―となります。

20170408-4全体がピンクフォント.jpg

ブログ全体の文字色が変更できました。このほかに、リンクテキスト文字色を変更することも可能です。

次の機会にお伝えします。

まとめ


文字色の変更で、ブログのイメージが、ガラッと変わります。

是非、ブログコンテンツに合わせた文字色に変更してみて下さいね。

JUGEM

カテゴリ:

TOPへ