FC2ブログのテンプレート工房

カスタマイズが簡単な共有テンプレートを配布しています。テンプレートをカスタマイズして自分だけのオリジナルブログを作りませんか？

リンクのスタイルを変える

リンクのスタイルや色を変える方法を紹介します。

スタイルシートの次の部分を編集します。スタイルシート上部にありスクロールしなくても見えるところにあるのですぐに見つけられると思います。

/************************************** ▼ リンクの色 ▼ */
a:link { color: #000000; }
a:visited { color: #000000; }
a:hover { color: #000000; }
a:active { color: #000000; }
/************************************** ▲ リンクの色 ▲ */

赤い部分の数値を変えてお好みの色にカスタマイズしてください。
また、リンクの下線を消したい場合は次の赤い文を加えます。

/************************************** ▼ リンクの色 ▼ */
a:link { color: #000000; text-decoration:none; }
a:visited { color: #000000; text-decoration:none; }
a:hover { color: #000000; text-decoration:none; }
a:active { color: #000000; text-decoration:none; }
/************************************** ▲ リンクの色 ▲ */

ちなみに4種類のリンクの意味は次のようになっています。

link　　未訪のリンク
visited　訪問済みのリンク
hover　　カーソルが上に乗っているリンク
active　アクティブ中のリンク

マウスカーソルを上に乗せたときだけ下線が出る、訪問済みは解かりやすく色を変える等、色々な使い方が出来ます。

お好みの色、スタイルにカスタマイズしてください。

< ここからは追記 (2006/08/09) >
「text-decoration:」の後ろには次のようなものがあります。

none 下線は付きません。

underline テキストに下線が付きます。

overline テキストに上線が付きます。

line-through テキストに打ち消し線が付きます。

blink テキストが点滅します。

例えばカーソルが乗ったときだけ下線を付けたい場合は次のようになります。

/************************************** ▼ リンクの色 ▼ */
a:link { color: #000000; text-decoration:none; }
a:visited { color: #000000; text-decoration:none; }
a:hover { color: #000000; text-decoration:underline; }
a:active { color: #000000; text-decoration:none; }
/************************************** ▲ リンクの色 ▲ */

記事編集 [ 2006/01/22 14:18 ] カスタマイズ　共通 | TB(1) | CM(30)

≪画像間の隙間(マージン)を調節する | HOME | 文字の大きさを変える≫

はじめまして。

はじめまして、ときどきファンタ＋と申します。履歴から来ました。

こんな技術があって、すばらしいですね！

ときどき参考にさせていただきます。よろしく御願いいたします。

[ 2006/01/22 18:47 ] [ 編集 ]

どんどん参考にしてください。

はじめましてときどきファンタ+さん。
どこまで力になれるか解かりませんが好きなだけ参考にしてくださいね。

[ 2006/01/22 18:57 ] [ 編集 ]

ノンママ

早速のご回答ありがとうござます。
なんて言ったらいいのでしょう・・
リンクの文字が例えば赤だったとして、リンクの上にカーソルを置くと手の文字に変わって・・『赤色が青色に変わる』方法はないでしょうか？？

いたおさんの説明をしてもリンクのカラーが変わるだけでした。

前使っていたのがこの方と同じのなんですが・・
http://reokun915.blog28.fc2.com/
リンクのところにカーソルを持っていってもらえますか？

説明が下手でご迷惑お掛けします。。

[ 2006/01/23 10:36 ] [ 編集 ]

管理人のみ閲覧できます

このコメントは管理人のみ閲覧できます

[ 2006/01/24 23:01 ] [ 編集 ]

こんばんは、ノンママさん。

具体的なURLを示してくれて有難うございます。
このような具体例を示してくれると質問者の要望が解かりやすくて助かります。

このテンプレートはリンクにマウスカーソルが乗ったときにリンクの背景に変化をつけていますね。

マウスカーソルが乗った時の設定は"hover"ですので

a:hover { color: #D2691E; background-color:#7FFFD4;}

赤い部分を加えるとマウスカーソルが乗ったときにリンク背景の色が変わります。数値は変えたい色に自由に変えてください。

[ 2006/01/25 00:44 ] [ 編集 ]

はじめまして！

つい昨日からもともとやっていたブログをこちらに切り替えようと奮闘中です！すごくシンプルな使いやすそうなテンプレートで一目ぼれです！

ところで初めてのカスタマイズに挑戦中ですが、リンクの色などすべて本文の字の色に変更したら、カレンダーまでリンクがなくなり見れなくなりました。

カレンダーだけは常時書き込みのある日にちだけ色が変わるように設定することはできないのでしょうか？

スタイルシート等は初めてなので、無謀な質問をしていたらすみません。よろしくお願いします！

[ 2006/02/13 21:31 ] [ 編集 ]

> sumsさん

こんばんは、sumsさん。

カレンダーだけリンクの色を変える方法を紹介します。次の記述をスタイルシートに加えてください。

.calender td a:link { color: #FF69B4;}
.calender td a:visited { color: #FF69B4;}
.calender td a:hover { color: #FF69B4;}
.calender td a:active { color: #FF69B4;}

数値はお好みの色に変えてください。
またこちらも参考になると思います。

http://10plate.blog44.fc2.com/blog-entry-20.html

カスタマイズ頑張ってくださいね。

[ 2006/02/14 00:40 ] [ 編集 ]

ありがとうございます！

早速やってみました！
できました！！（感激）

これからもちょっとづつがんばってみようと思います
ありがとうございました！

[ 2006/02/14 02:12 ] [ 編集 ]

> sumsさん

こんばんは、sumsさん。
カスタマイズは楽しいですよ。
これからもどんどん挑戦してください。

[ 2006/02/15 02:10 ] [ 編集 ]

はじめまして。

初めまして。
いたおさんが作っていらっしゃるテンプレートを使用させていただいているのですが、トラックバックの部分だけ色を変更したいのですが、ご教授願えないでしょうか？
どうも自分だけでは出来そうもありません（＾＾；

[ 2006/03/15 22:14 ] [ 編集 ]

> ｱﾆｰﾀｿさん

こんばんは、ｱﾆｰﾀｿさん。
週末には回答致します。
申し訳ありませんがもう少々お待ちください。

(3/19追記)
回答が遅くなって申し訳ありません。
トラックバックの部分だけ色を変える方法を掲載しました。
http://10plate.blog44.fc2.com/blog-entry-51.html
この説明で解からないことがあればまた聞いてくださいね。

[ 2006/03/17 00:21 ] [ 編集 ]

はじめまして。
何処で聞こうか迷いましたがとりあえずここにコメント残させてもらいます。
・本文（記事内）のみのリンクスタイル変更は新たな項目を作って弄らないと駄目でしょうか？
・検索時やカテゴリ表示の際、記事の上部にでる[ *** ]をデフォルト状態でも表示（最新記事）させたいのですがどう弄ればよいでしょうか？
自分で努力してみましたがうまく出来ないので助言をお願いしたいです。

[ 2006/10/21 13:27 ] [ 編集 ]

> 氷雨さん

こんばんは、氷雨さん。
記事のリンクを変えるには、記事に挿入されるリンクタグaにスタイル指定します。

例えば<a style="color:#ff0000" href="#" target="_blank">ここ</a>を赤くする

style="color:#ff0000"を上記位置に加えると記事内のリンクだけ色を変えられます。

最新記事を記事上部に表示させたいのであれば、プラグインの「最新の記事」をプラグインカテゴリ３に設定してください。

カテゴリ３に設定したプラグインは全て記事上部に表示されますよ。

[ 2006/10/21 19:11 ] [ 編集 ]

説明ありがとうございました。
新しくテンプレートをDLしたらプラグイン3が上部に表示されました。
どうもありがとうございました。

[ 2006/10/21 22:16 ] [ 編集 ]

> 氷雨さん

こんにちは、氷雨さん。
記事上部にフリーエリアがあれば良かったのにという意見をよく頂きます。「カテゴリ３にすればプラグインが記事上部に表示される」ことが伝わっていないことは私の責任です。そろそろ機能仕様や利用規約も書かないといけないと思っていたところです。

[ 2006/10/22 16:05 ] [ 編集 ]

こんばんは。いつもお世話になっています。
今、リンクの色をグリーンにしてるんですが、記事内だけをデフォルトで青など別の色に設定できますでしょうか。
記事を書くときに１つずつ色変更するのは可能なんですが、スタイルシートとかの設定を変更してデフォルトで青にしたいのです。
多分氷雨さんの質問と同じなのかな？と思いましたが、どうもお答えを見ても分からず・・・(汗
重複の質問でしたらすみません_(._.)_
よろしくお願いします。

[ 2006/11/05 03:58 ] [ 編集 ]

> みゆみさん

こんばんは、みゆみさん。
ご質問の件について記事に掲載したのでこちらをご参照ください。

記事内のリンクの色、スタイルを設定する
http://10plate.blog44.fc2.com/blog-entry-96.html

カスタマイズ頑張ってくださいね。

[ 2006/11/06 23:50 ] [ 編集 ]

ありがとうございます_(._.)_
わざわざ新しく投稿してくださったんですね！感激です！！
近日中に早速変更したいと思います。
本当にありがとうございました！

[ 2006/11/08 03:44 ] [ 編集 ]

> みゆみさん

こんばんは、みゆみさん。
このカスタマイズを求める人は意外と多いようです。私の気づかないアイデアを教えてくれて有難う御座いました。

[ 2006/11/10 01:36 ] [ 編集 ]

こんにちは！
いたお様お元気でしょうか？
rintanは風邪にやられております。
これからますます寒くなりますので、お気をつけてくださいね。

報告が遅くなりましたが、少し前にこの記事を知って、リンクの色を変えてみました。
お陰さまで非常に満足しております。
進化していくテンプレートっていいですね。
ありがとうございました。

[ 2006/11/12 16:50 ] [ 編集 ]

> rintan999さん

こんばんは、rintan999さん
有難う御座います。最近ちょっと忙しく更新が滞り気味ですが私は元気です。
rintan999さんは風邪をひいてしまったのですか?お体に気をつけてくださいね。
自分が良いと思うものを他人が良いと共感してくれるのが嬉しいように、テンプレートが進化することに喜びを感じてくれると私もとても嬉しいです。有難う御座います＾＾

[ 2006/11/12 19:44 ] [ 編集 ]

初めまして

初めまして。らむねと申します。

lightframeを最近ダウンロードさせていただいたのですが
どうしても　リンクにマウスをのせたときの打ち消し線が消せません
ここに書いてある事はやってみたのですが　何故なんでしょうか？
色は変わるんですけど・・・

教えていただけるとうれしいです
よろしくお願いします。

[ 2007/02/27 17:10 ] [ 編集 ]

＞らむねさん

「HTML」のヘッダー内にあるカーソルを変える記述の


</STYLE>

赤字の部分が打ち消し線が出る原因ではないでしょうか？
そこを変更すれば大丈夫かと思いますが・・・。

[ 2007/02/27 19:46 ] [ 編集 ]

> らむねさん、かどりんさん

有り難うございます、かどりんさん。
親切な方が多くて私は本当に嬉しいです。とても助かります＾＾

らむねさん、かどりんさんが示してくれた部分を none; と書き換えてください。これで打ち消し線が出なくなると思います。

[ 2007/02/28 00:06 ] [ 編集 ]

＞かどりんさん、いたおさん

ありがとうございました！
とってもわかりやすくて　すぐに変更できましたぁ

どうもありがとうございました。

[ 2007/02/28 00:27 ] [ 編集 ]

> らむねさん

こんばんは、らむねさん。
変更できましたね＾＾
また何でも聞いてくださいね。

[ 2007/03/01 02:04 ] [ 編集 ]

管理人のみ閲覧できます

このコメントは管理人のみ閲覧できます

[ 2007/10/31 16:20 ] [ 編集 ]

タイトルリンクの変更方法

こんにちは、はじめまして。

素晴らしいテンプレートを提供頂き誠に

ありがとうございます。

おかげさまで色々楽しくカスタマイズさせて頂いています。

ところで、質問があります。

記事リンクの変更方法はわかったのですが、

ブログのタイトル文字にカーソルを載せたら色が

変わったり、下線が付いたりする方法をサイト内で

検索してみたのですがどうしても見つかりません。

どなたかご教授願えませんでしょうか？

よろしくお願い致します。

[ 2008/03/09 10:14 ] [ 編集 ]

記事タイトルに日付を入れる

はじめまして。
とても使いやすいテンプレートありがとうございます。

質問なのですが、記事を書いたときに、「記事タイトル」の
末尾などに自動的に日付が挿入されるようには、
設定できないでしょうか。

[ 2008/03/10 04:29 ] [ 編集 ]

タイトルリンクの変更方法

自己解決しました、どうもすいません。

[ 2008/03/10 10:47 ] [ 編集 ]

コメントの投稿