QLOOKアクセス解析
ホーム > スポンサー広告 > リンクはやっぱり青色下線がいいみたい(^^)のつづきホーム > fc2ブログ > リンクはやっぱり青色下線がいいみたい(^^)のつづき
 1件ずつ表示 
--.--.-- --

スポンサーサイト

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。

続きを読む
Category: スポンサー広告
2014.11.21 Fri

リンクはやっぱり青色下線がいいみたい(^^)のつづき

おはようございます(*´▽`*)

昨日はわけわからないまま記事が終わった感じでしたので、今日でまとめたいと思います。

今日は リンクの青文字を決める。リンクのCSSについてちょっと説明。コードコーラの取得はこちら。

という流れでいきます!!

リンクの青文字は何色にするか?? Googleさんに聞きにいきましょう(*´▽`*)

Googleの検索画面でCode Cola(コードコーラ)を開いてリンクの文字を選択。

Colorの欄を見ると rgb(27、14、171) の文字。これが色です。

こちらのサイトでrgb→16進数のカラーコードに変換すると #1b0eab

色が決まったので、早速リンク色の変更をしましょう(*´▽`*)

リンクの色は、テンプレートの設定の CSS編集(下段の枠) で行います。

設定

aがリンクの設定です。:コロンの後の英語の意味を説明すると、

a:link {color: 色;} → 未訪問のリンク

a:visited { color : 色;} → 訪問済みのリンク

a:hover { color : 色;} → カーソルが重なったときのリンク

a:active { color : 色;}  → クリックしたときのリンク

アンダーラインは何も指定しなければ、リンクに自動でつきます。

アンダーラインがない人は設定に text-decoration : none; となっています。

今回はリンクに下線をつけるので、text-decoration : none; の文字を消します。

結局どうしたらいいの??という人のために私の設定を書いておきます。


a:link{ color: #1b0eab;}  

a:visited { color : #990099;} 
 
a:active { color: #777777;
text-decoration : none;}  

a:hover { color: #777777;
text-decoration : none;}  



.entry-body a { color: #1b0eab;} で記事内だけの設定にするつもりでしたが、なかなかいい感じに仕上がったので、

すべてのリンクをこれにするために、上記のような設定にしました(*´▽`*)

太字・デカ文字もなくしてシンプルな設定にしてみました♬

Code Cola(コードコーラ)

あると♪さんがコカコーラに見えると言ってましたが、カタカナでGoogle検索すると、ほんとにコカコーラ出てきます('Д')

インストールはGoogle Webstore からできます。

インストールすると画面右上に表示されます(黄緑色のがコードコーラ)
コードコーラ

ぽちっと押すと起動。終わるときもぽちっと押すだけ。

使いこなせればいろんなサイトのデザインを自分のブログにも使えるし、自分のブログを自由にカスタマイズできるんだけどな。。。

今後そういうのも記事であげていく予定ですので、楽しみにしててください(^^♪

今回の記事ではあんまりコードコーラ使いたい!!ってならないし。。(;´Д`)




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


貼るだけでお小遣い貰えます♬(忍者ADMAX)↓↓


関連記事

続きを読む
Category: fc2ブログ Comments (2) Trackbacks (0)

この記事へのコメント:

いやぁ、凄いです。ちゃんと頭の中まとまってますね!
って、少し変な言い方でしたか?いや、私も今ブログの改築をしてまして
記事にしてやるんだと思っているんですが
何をどうへんこうしたのか・・・笑
行き当たりばったりはダメですね。
こんばんわ^^

私の変なつぶやきを拾っていただきありがとうございますww( ̄ε ̄〃)ゞ

コカコーラに見えちゃったんですから...w

でも便利そうですね♪(≧∇≦)b

そして、リンクの色とってもイイ感じで見やすいです♪

こう言う配色ってホント悩みますよね^^;

この記事へコメントする:


    

この記事のトラックバックURL:

http://illustrator989.blog.fc2.com/tb.php/74-de317ee4

この記事に対するトラックバック:

上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。