リンクを貼った文字の色を変える方法

このQ&Aのポイント
  • リンクを貼った文字の色を変える方法について質問があります。
  • リンクの文字を最初は赤にして、触れたときに桃色に変えたいと考えていますが、うまくいかないようです。
  • フォントで囲むとリンクの色が変わらず、外すと色が変わるため、解決方法を教えてください。
回答を見る
  • ベストアンサー

触れたときに文字の色を変える方法

こんばんは。 リンクを貼った文字を最初は赤にし、触れたときに桃色にしようと思っています。 <head></head>の中に <style type="text/css"> <!-- a:hover{color:pink;} --></style> とし、 <A href="アドレス"><font size=2 color=red>文字</font></A> のようにリンクを貼りました。 しかし、赤のままで触れても桃色になりません。 フォントで囲むのをやめると、文字は青で触れたら黄色になりました。 どうすれば私のしたいようにできるでしょうか? ご指導よろしくお願いいたします。

  • mana99
  • お礼率46% (496/1076)

質問者が選んだベストアンサー

  • ベストアンサー
  • perla
  • ベストアンサー率63% (67/105)
回答No.1

こんばんは。 <STYLE TYPE="text/css"> <!-- A:link { color:red ;} A:visited { color:red ;} A:hover { color:pink ;} --> </STYLE> で、どうでしょうか。

mana99
質問者

お礼

できました!ありがとうございました。 とても助かります。

関連するQ&A

  • 文字の色をスタイルシートで設定した時、ハイパーリンクの文字の色を変えたいのですが

    スタイルシートの定義で質問です。 文字の色をスタイルシートで設定したとき、ハイパーリンクの文字の色を変えたいのですが やり方が分かりません。よろしくお願いします。 htmlは次の様に書いてます。 これだと、ハイパーリンク文字にマウスをおいても白文字のままです。 この時、赤色にかえたいのですが。 <head> <style type="text/css"> .style1 { color: #FFFFFF; font-size: small; } a:hover { color: red; text-decoration: none; } </style> </head> <body> <a href="xxxx.htm"> <span class="style1">ハイパーリンク文字</span></a> ・ ・ </body>

  • 特定の画像リンクだけhover時の文字色を変更

    特定の画像リンクにだけスタイルを適用したいと思っています。 特定の画像リンクにクラス名“diet”と付けて、そのリンクにだけ hover 時の文字の色を赤色にしようと考えています。 その場合の記述の仕方を教えてください。 次のように記述しているのですが、うまくいきません。 HTMLに直接書き込む方法にしています。 <head> <style type=”text/css”> <!- a.diet :hover {color: red;} -> </style> </head> <body> <a href="アドレス"><img src=画像のアドレス></a> </body> (必要なところだけ抜粋しています) どこが間違っているのでしょうか? 何度やってもうまくいません。 クラスの書き方がよくないのでしょうか? できれば、HTMLに直接書き込む場合と、CSSを利用する場合の、2つの書き方を教えてください。 どうぞよろしくお願いします。

    • ベストアンサー
    • HTML
  • リンクを張った文字列の色

    次のようにするとlink、hover、active、viewedのそれぞれの場合に「リンク先のページのタイトル」の文字列の色がgreen、#ffdddd、#ffffdd、maroonになると思ったのですが、うまくいきません。maroonのままです。 <html> <head> <style type="text/css"> <!-- table {font-size:12px; } a.x:link {color:green; text-decoration:none; } a.x:hover {color:#ffdddd; } a.x:active {color:#ffffdd; } a.x:visited {color:maroon; } --> </style> </head> <body> <table border="0" width="100%" height="400" text="bold"> <tr><td><a href="http://www......html" class="x" target="_blank">リンク先のページのタイトル</a>/td></tr> </table> </body> </html> よろしくお願いします。

    • ベストアンサー
    • HTML
  • 擬似クラスがupできない

    こんばんは。どうしても擬似クラスがupできません。 =01.css= <style type="text/css"> a:hover{ font-weight:bold; text-decoration:none; color:red; } </style> =index.html= <html> <head> <title>○▲□×</title> <link rel="stylesheet" href="01.css" type="text/css"> </head> どうして擬似クラスがupできないのですか? どこか打ち間違いでしょうか? hoverだけ使いたいので、それ以外は打つ必要ないと 思いますし、今後、他のスタイルも加えて行きたくも 思ってます。 どうぞよろしくお願いします。

  • リンクだけが指定にない色になります。

    テキストの色を全体に統一したいのですが、リンク部分のみ指定にない色(青)になります。 <STYLE type="text/css"> <!-- a:hover { color:ffffff; } --> </style> <BODY TEXT="CC0033" VLINK="CC6666" ALINK="CC6666"> <A HREF="link.html "STYLE="TEXT-DECORATION:NONE;"> <FONT SIZE=-2>link</FONT></A> 直接リンク文字に色を指定すれば直るのですが、スタイルシートでマウスがリンクに触れた時色が変わるという設定が効かなくなるようです。この設定を外さず、任意の色に変える方法はありませんでしょうか。 そのようなサイトを知っている、でも構いません。どうかよろしくお願いいたします。 (powermacG4/OS9/IE5/NN4.7/Jedit4.0)

    • ベストアンサー
    • HTML
  • なぜ文字がでかくなってしまうのでしょうか?

    http://masaboo.cside.com/new_css1/cs_11.htmを見てるのですが ************************************** <HTML> <HEAD> <TITLE>サンプル</TITLE> <STYLE type="text/css"> <!-- H1 { color:red; } P { color:green; } --> </STYLE> </HEAD> <BODY> <H1>レベル1の見出しは赤色です。</H1> <P>段落は、緑色です。</P> </BODY> </HTML> ************************************** のサンプルの意味がよくわからないのですが、 なぜ、 H1 { color:red; } を宣言するだけで、文字がでかくなってしまうのでしょうか? フォントサイズに関する記述がないのに、 赤文字が大きくなる理由を教えてください。

    • ベストアンサー
    • HTML
  • マススポインタがリンクの上に乗ると色が変わる設定方法

    ホームページを作成中です。 リンクの上にポインタを置くと、背景色と文字色を変えるようにしたいのですが、 それについてはこちらの以前からの質問で、 テキストエディタの<head>~</head>内に、 <style type="text/css"> a:link { color:blue; text-decoration:none; } a:visited { color:green; text-decoration:none; } a:active { color:pink; text-decoration:none; } a:hover { background-color:yellow; color:red; text-decoration:underline overline; } </style> と入れると色が変わるようになることを知りました。 その場合、そのままの状態では文字は緑色、マススを乗せると背景が黄色で文字色が赤色に、 クリック後はピンク色の文字に変わるようになると思います。 『a:link { color:blue; text-decoration:none; }』の部分はどこに生かされているのかわかりません。 この部分は一体何の意味があるのでしょうか? また、上記をテキストエディタに貼り付けてしまうと、リンク部分が全てそうなってしまいますよね? マウスを乗せた時には同じ背景色・文字色になってもいいのですが、 何もしない状態(見た目、上記で言う何もしない状態の時)にそれぞれに色を変える場合はどのようにすればいいのですか? 例えると、下記3項目にそれぞれリンクテキストが貼り付けてあるとして、   あいうえお  → ここは青色に   かきくけこ  → ここはオレンジ色に   さしすせそ  → ここは黄色に      する場合、 どのような操作(作業)をすればそのとおりの色に変えることができるでしょうか? とても解りづらい質問ですみませんが、よろしくお願いします。

    • ベストアンサー
    • HTML
  • マウスをリンクの上に置くと色が変わる部分と変わらない部分がある

    みなさん、はじめまして 質問させてください<(_ _)> いまホームページビルダーを用いてHPを作成しているのですが、マウスをリンク部分の上に置くと文字の色を変えたくていろいろ試しました。 行った方法はheadの間を <STYLE type="text/css"> <!-- A:hover{color : red;} --> </STYLE> という文字を入力しました。 その結果、画面の一部分は色がかわるのですが、他の部分は変わらないのです。 この場合どのようにしたらよろしいでしょうか?

  • CSSの文字指定

    <style type="text/css"> <!--A:link {color:#000055; text-decoration:none; } A:visited {color:#000055; text-decoration:none; } A:hover {color:#ff3300; text-decoration:underline; }--></style> 上部はcssのリンクですが、これに加えて文字のサイズ指定とフォントのフェイス指定もしたいです。 たとえば、MSゴシック,平成角ゴシックなど。 どう加えればよいですか? <style type="text/css"> font:16px "MS Pゴシック",平成角ゴシック,</style>とやってもダメでした と

    • ベストアンサー
    • HTML
  • CSS:リンクにカーソルを合わせたときに文字の色が変わらない

    CSSでリンクする文字をカーソルが上に乗ったとき、文字の色を赤、下線を無くすようにしようと思ったのですが、下線部は消えるのですが文字が赤くなりません。 これを解決する方法はないでしょうか? a:hover {color: red; text-decoration: none} 回答よろしくお願いします。

    • ベストアンサー
    • HTML