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; }
/************************************** ▲ リンクの色 ▲ */
関連記事
[ 46 ] はじめまして。
はじめまして、ときどきファンタ+と申します。履歴から来ました。

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

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

[ 2006/01/22 18:47 ] [ 編集 ]
[ 47 ] どんどん参考にしてください。
はじめまして ときどきファンタ+さん。
どこまで力になれるか解かりませんが好きなだけ参考にしてくださいね。
[ 2006/01/22 18:57 ] [ 編集 ]
[ 52 ] ノンママ
早速のご回答ありがとうござます。
なんて言ったらいいのでしょう・・
リンクの文字が例えば赤だったとして、リンクの上にカーソルを置くと手の文字に変わって・・『赤色が青色に変わる』方法はないでしょうか??

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

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

説明が下手でご迷惑お掛けします。。
[ 2006/01/23 10:36 ] [ 編集 ]
[ 57 ] 管理人のみ閲覧できます
このコメントは管理人のみ閲覧できます
[ 2006/01/24 23:01 ] [ 編集 ]
[ 60 ] こんばんは、ノンママさん。
具体的なURLを示してくれて有難うございます。
このような具体例を示してくれると質問者の要望が解かりやすくて助かります。

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

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

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

赤い部分を加えるとマウスカーソルが乗ったときにリンク背景の色が変わります。数値は変えたい色に自由に変えてください。
[ 2006/01/25 00:44 ] [ 編集 ]
[ 161 ] はじめまして!
つい昨日からもともとやっていたブログをこちらに切り替えようと奮闘中です!すごくシンプルな使いやすそうなテンプレートで一目ぼれです!

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

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

スタイルシート等は初めてなので、無謀な質問をしていたらすみません。よろしくお願いします!
[ 2006/02/13 21:31 ] [ 編集 ]
[ 163 ] > 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 ] [ 編集 ]
[ 164 ] ありがとうございます!
早速やってみました!
できました!!(感激)

これからもちょっとづつがんばってみようと思います
ありがとうございました!
[ 2006/02/14 02:12 ] [ 編集 ]
[ 169 ] > sumsさん
こんばんは、sumsさん。
カスタマイズは楽しいですよ。
これからもどんどん挑戦してください。
[ 2006/02/15 02:10 ] [ 編集 ]
[ 246 ] はじめまして。
初めまして。
いたおさんが作っていらっしゃるテンプレートを使用させていただいているのですが、トラックバックの部分だけ色を変更したいのですが、ご教授願えないでしょうか?
どうも自分だけでは出来そうもありません(^^;
[ 2006/03/15 22:14 ] [ 編集 ]
[ 247 ] > アニータソさん
こんばんは、アニータソさん。
週末には回答致します。
申し訳ありませんがもう少々お待ちください。

(3/19追記)
回答が遅くなって申し訳ありません。
トラックバックの部分だけ色を変える方法を掲載しました。
http://10plate.blog44.fc2.com/blog-entry-51.html
この説明で解からないことがあればまた聞いてくださいね。
[ 2006/03/17 00:21 ] [ 編集 ]
[ 675 ]
はじめまして。
何処で聞こうか迷いましたがとりあえずここにコメント残させてもらいます。
・本文(記事内)のみのリンクスタイル変更は新たな項目を作って弄らないと駄目でしょうか?
・検索時やカテゴリ表示の際、記事の上部にでる[ *** ]をデフォルト状態でも表示(最新記事)させたいのですがどう弄ればよいでしょうか?
自分で努力してみましたがうまく出来ないので助言をお願いしたいです。
[ 2006/10/21 13:27 ] [ 編集 ]
[ 679 ] > 氷雨さん
こんばんは、氷雨さん。
記事のリンクを変えるには、記事に挿入されるリンクタグaにスタイル指定します。

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

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

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

カテゴリ3に設定したプラグインは全て記事上部に表示されますよ。
[ 2006/10/21 19:11 ] [ 編集 ]
[ 681 ]
説明ありがとうございました。
新しくテンプレートをDLしたらプラグイン3が上部に表示されました。
どうもありがとうございました。
[ 2006/10/21 22:16 ] [ 編集 ]
[ 686 ] > 氷雨さん
こんにちは、氷雨さん。
記事上部にフリーエリアがあれば良かったのにという意見をよく頂きます。「カテゴリ3にすればプラグインが記事上部に表示される」ことが伝わっていないことは私の責任です。そろそろ機能仕様や利用規約も書かないといけないと思っていたところです。
[ 2006/10/22 16:05 ] [ 編集 ]
[ 741 ]
こんばんは。いつもお世話になっています。
今、リンクの色をグリーンにしてるんですが、記事内だけをデフォルトで青など別の色に設定できますでしょうか。
記事を書くときに1つずつ色変更するのは可能なんですが、スタイルシートとかの設定を変更してデフォルトで青にしたいのです。
多分氷雨さんの質問と同じなのかな?と思いましたが、どうもお答えを見ても分からず・・・(汗
重複の質問でしたらすみません_(._.)_
よろしくお願いします。
[ 2006/11/05 03:58 ] [ 編集 ]
[ 747 ] > みゆみさん
こんばんは、みゆみさん。
ご質問の件について記事に掲載したのでこちらをご参照ください。

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

カスタマイズ頑張ってくださいね。
[ 2006/11/06 23:50 ] [ 編集 ]
[ 754 ]
ありがとうございます_(._.)_
わざわざ新しく投稿してくださったんですね!感激です!!
近日中に早速変更したいと思います。
本当にありがとうございました!
[ 2006/11/08 03:44 ] [ 編集 ]
[ 759 ] > みゆみさん
こんばんは、みゆみさん。
このカスタマイズを求める人は意外と多いようです。私の気づかないアイデアを教えてくれて有難う御座いました。
[ 2006/11/10 01:36 ] [ 編集 ]
[ 774 ]
こんにちは!
いたお様お元気でしょうか?
rintanは風邪にやられております。
これからますます寒くなりますので、お気をつけてくださいね。

報告が遅くなりましたが、少し前にこの記事を知って、リンクの色を変えてみました。
お陰さまで非常に満足しております。
進化していくテンプレートっていいですね。
ありがとうございました。
[ 2006/11/12 16:50 ] [ 編集 ]
[ 780 ] > rintan999さん
こんばんは、rintan999さん
有難う御座います。最近ちょっと忙しく更新が滞り気味ですが私は元気です。
rintan999さんは風邪をひいてしまったのですか?お体に気をつけてくださいね。
自分が良いと思うものを他人が良いと共感してくれるのが嬉しいように、テンプレートが進化することに喜びを感じてくれると私もとても嬉しいです。有難う御座います^^
[ 2006/11/12 19:44 ] [ 編集 ]
[ 1304 ] 初めまして
初めまして。らむねと申します。

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

教えていただけるとうれしいです
よろしくお願いします。
[ 2007/02/27 17:10 ] [ 編集 ]
[ 1307 ] > らむねさん、かどりんさん
有り難うございます、かどりんさん。
親切な方が多くて私は本当に嬉しいです。とても助かります^^

らむねさん、かどりんさんが示してくれた部分を none; と書き換えてください。これで打ち消し線が出なくなると思います。
[ 2007/02/28 00:06 ] [ 編集 ]
[ 1308 ] >かどりんさん、いたおさん
ありがとうございました!
とってもわかりやすくて すぐに変更できましたぁ

どうもありがとうございました。
[ 2007/02/28 00:27 ] [ 編集 ]
[ 1310 ] > らむねさん
こんばんは、らむねさん。
変更できましたね^^
また何でも聞いてくださいね。
[ 2007/03/01 02:04 ] [ 編集 ]
[ 2924 ] 管理人のみ閲覧できます
このコメントは管理人のみ閲覧できます
[ 2007/10/31 16:20 ] [ 編集 ]
[ 3163 ] タイトルリンクの変更方法
こんにちは、はじめまして。

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

ありがとうございます。

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

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

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

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

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

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

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

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

[ 2008/03/09 10:14 ] [ 編集 ]
[ 3165 ] 記事タイトルに日付を入れる
はじめまして。
とても使いやすいテンプレートありがとうございます。

質問なのですが、記事を書いたときに、「記事タイトル」の
末尾などに自動的に日付が挿入されるようには、
設定できないでしょうか。
[ 2008/03/10 04:29 ] [ 編集 ]
[ 3166 ] タイトルリンクの変更方法
自己解決しました、どうもすいません。
[ 2008/03/10 10:47 ] [ 編集 ]
[ 4128 ] リンクに管理画面が
いたおさん。ここのところ、画像の組み合わせ問題では、大変お世話になりました。

ところで、昨日、ふと、右のサイドバーの「リンク」に、私個人の別ブログのリンクを張ったところ、そのすぐ下(同じリンク枠内)に「管理画面」項目がでており、そこをクリックすると、管理画面に入れるようになったのに気付きました。

もしかしたら、これは、私以外の方でも、ここをクリックすると「管理画面」に入れるのでしょうか?いえ、私がログインしているので、そうなるのでしょうか?

もし、前者でしたら、セキュリティ上、問題がある気がしまして、ご連絡しました。この場合、どのような対策をすればいいのでしょうか?

私の使用しているテンプレートは、「templ8_3kuro」です。
[ 2009/05/09 13:08 ] [ 編集 ]
[ 4130 ] ▼Ajinciさん
Ajinciさん以外の方は管理画面に入ることは出来ないので大丈夫です。
http://ja.wikipedia.org/wiki/HTTP_cookie

ただしネットカフェ等で利用した際、ログアウトし忘れてお店を出てしまった場合に店側がクッキーの削除等のメンテナンスをしてくれなかったら次の利用者が管理画面に入ることが出来てしまいます。

大体のネカフェはやってくれると思いますが、前利用者の履歴や設定等、そのまま放置のお店も少なからずあるので、自宅以外はちゃんとログアウトしたほうが良いです。
[ 2009/05/09 13:21 ] [ 編集 ]
[ 4132 ] > ちゃんさん、Ajinciさん
ちゃんさん、ありがとうございます^^

Ajinciさん、ちゃんさんが教えてくれた通り、自分しか使わないパソコンからログインしているなら大丈夫です。
[ 2009/05/09 13:29 ] [ 編集 ]
[ 4133 ] 有難うございます。
ちゃんさん、いたおさん。お返事有難うございます。
安心しました。ネットカフェで使用するときは気をつけます。

ところで、そもそも、この「管理画面」の表示そのもの、さらにリンク枠の中にある「このブログをリンクに追加する」を表示させないこともできるのでしょうか?もし、可能でしたら、その方法を教えていただけないでしょうか。

何度もスミマセン。
[ 2009/05/09 13:52 ] [ 編集 ]
[ 4135 ] > Ajinciさん
こちらの記事を参考にしてください。

「管理者ページ」を移動する
http://10plate.blog44.fc2.com/blog-entry-79.html

「このブログをリンクに追加する」を付ける
http://10plate.blog44.fc2.com/blog-entry-93.html
[ 2009/05/09 14:06 ] [ 編集 ]
[ 4142 ] > Ajinciさん
申しわけありません。FC2が管理画面の仕様、文言等を変えていたので記事の内容が古くなっていました。

上記2つの記事を新しく更新したので再度確認してください。
[ 2009/05/09 20:17 ] [ 編集 ]
[ 4143 ] 有難うございます!
いたおさん。今、いたおさんに、上記お返事をいただく直前、ご指定いただいていた両ページを覗き直し、更新していただいた記事(?)を見ながら操作したところ、問題が解決したため、(上記、お返事いただいたいたのに気付かず)、無駄なコメントはご迷惑と思い、前・自分のコメントを削除してしまいました。その結果、上記、いたおさんのコメントが2つ続く妙な表示になってしまったようです。申し訳ありません。

問題解決しました。有難うございます、いつも、いつも!!
[ 2009/05/09 20:38 ] [ 編集 ]
[ 6215 ]
リンクやカテゴリの前にある黒丸をのけるにはどうすればよいですか?
[ 2009/09/26 00:05 ] [ 編集 ]
[ 6216 ]
ここでいいのか分かりませんがひとつ質問を・・・
リンクやカテゴリ、最新記事の前につく黒丸を取りたいのですが、
どうすればいいのでしょうか?
[ 2009/09/26 00:09 ] [ 編集 ]
[ 6219 ] > 6215(6216)さん
こちらの記事を参考にしてください。

リストの「・」を消す
http://10plate.blog44.fc2.com/blog-entry-137.html

コメント管理を容易にするため名前を記入してくれると助かります。
[ 2009/09/26 00:28 ] [ 編集 ]
[ 6238 ] 質問させていただきます。
リンクのスタイルや色を変える方法に挑戦中なのですが、
プレビューでみると、うまく色が変っているのですが、
更新を押して、再度みてみると もとの色に戻ってしまうのです。

なにかやり方がちがうのでしょうか?
お時間あるときに、コメントだしていただけると助かります。

突然コメント失礼しました。
[ 2009/09/26 17:16 ] [ 編集 ]
[ 6239 ] 管理人のみ閲覧できます
このコメントは管理人のみ閲覧できます
[ 2009/09/26 18:39 ] [ 編集 ]
[ 6251 ] > やっちゃん!さん
鍵コメ拝見しました。とりあえず良かったです^^
[ 2009/09/27 00:52 ] [ 編集 ]
[ 8779 ] 承認待ちコメント
このコメントは管理者の承認待ちです
[ 2010/12/31 07:49 ] [ 編集 ]
コメントの投稿









管理者にだけ表示
※現在カスタマイズに関するサポートを休止中です。
表示が崩れる場合は表示が崩れる原因の調査手順をお試しください。
その他の問題はFC2ユーザーフォーラムにお問い合わせください。
トラックバック
この記事のトラックバックURL

ダイエットブログのカスタマイズ
ダイエット関連の様々な情報をまとめよう を より使いやすいする為に、カスタマイズしてと・・ 色んなページ(ダイエット関連以外)を見て回り この「ダイエット関連の様々な情報」が使い易く なれば・・ ■参照サイト■ リンクをマウスでポイントすると動くカスタマイ
ブログ内検索1
プロフィール

いたお

Author:いたお
更新は非常にマイペースです
現在休止中です

当サイトはリンクフリーです。

いたおの他の運営サイト
カレンダー
08 | 2023/09 | 10
- - - - - 1 2
3 4 5 6 7 8 9
10 11 12 13 14 15 16
17 18 19 20 21 22 23
24 25 26 27 28 29 30
なんでもスクロール
このように
縦に長く伸びた
プラグインを
スクロールバーによって
一定の長さに
抑えることが
出来ます。

※スクロールさせる文字やプラグインのHTMLをここに
今日の日付入りカレンダー

08 | 2023/09 | 10
- - - - - 1 2
3 4 5 6 7 8 9
10 11 12 13 14 15 16
17 18 19 20 21 22 23
24 25 26 27 28 29 30
ユーザータグ


△ ページトップへ戻る