「STINGER3」続きを見るのボタンの色を変更してみた。

公開日: : STINGER3

stinger3 続きを見る カスタム

前回は続きを見るを右側に移動してみましたが今回はボタンの色を変えてみたいと思います。ボタンの色を変えると言っても今回は続きを見るにカーソルをあわせたときの色だけを変更します。

通常は薄いグレーっぽい色ですが、カーソルをあわせるとピンク色に変わりますよね?このピンク色を変更するってことです。

変更方法はとっても簡単でした。

スタイルシート(style.css)を編集

スタイルシートの見るべきところは前回と同じ辺りですが.motto a hoverから3行目辺りのbackground-color:という部分。

#FFAAAA;となってますよね?このカラーコードがあのピンク色ってことなのでここを好きな色のカラーコードに変更すれば変わるという訳です。簡単ね。


stinger3続きを見るボタンの色を変える

カラーコードとかは探せば山ほど出てくると思いますが一応貼っときます。

カラーコード一覧表

 

で、実際どう変わったかというと。。。。

続きを見るの色をかえたよ

色しか変えてないので何だか地味かもしれませんがとりあえずピンクなのが気になっていたのでこれですっきりしました。

グラデーションや影を付けたりというのもいいかもしれませんね。また今度やってみよう!

それでは。

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

関連記事

「STINGER3」見出しh3アイコンカラーを変更してみた。

STINGER3のh3にはチェックボックスのようなアイコンが表示されますが 今回はこのアイコ

記事を読む

「STINGER3」トップページの記事と記事の間に区切り線を入れてみた。

今回やってみたカスタムはSTINGER3のトップページに表示される記事と記事の間に区切り線を

記事を読む

「STINGER3」背景画像を変えてみた。

STINGER3もかなり有名なテーマになってきたのもあってか、「あぁ〜ここもstinger3

記事を読む

「STINGER3」続きを読むを右側へ移動してみた。

  今回はトップページにある最新記事の続きを見るを右側へ移動してみたのでつら

記事を読む

「STINGER3」スマートフォンでのアイキャッチ画像周りのふちと枠を非表示にしてみた。

stinger3をスマホで表示するとアイキャッチ画像の周りに白いふちと枠線が表示されます。今回は

記事を読む

WordPressテンプレート「STINGER3」にしてみた。

当ブログはwordpressという無料のウェブサービスを利用して運営しています。アメブロやFC2

記事を読む

「STINGER3」SNSボックスの表示を横から縦に変えてみた。

みんな大好きSTINGER3。 でもこのSNSボックスの横表示だけは何だか記事が読みに

記事を読む

「STINGER3」サイドバーのNEW ENTRYを消してみた。

STINGER3はトップ画面に最新記事が並び、サイドバー上部にも同じ最新記事が並んでしまいま

記事を読む

「STINGER3」スマートフォンでのヘッダー画像を表示してみた。

stinger3はスマートフォンでブログを表示させた時なぜかヘッダー画像は表示されません。そ

記事を読む

「STINGER3」サイドバーの見出しデザインを変えてみた。

STINGER3のサイドバー見出し。これはこれでシンプルで好きだったんだけどやっぱり少しはオリジナリ

記事を読む

Message

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

  • プロフィール

    運営者:C3 (しーさん)

    愛知県知多半島在住の会社員。兼業アフィリエイター。2児の父。本業とアフィリエイトの収入で心を豊にするのが2015年の目標。月の副業収入は今のところ非公開にしています。というか全然稼いでいません...。

    follow us in feedly

PAGE TOP ↑