• ベストアンサー

テキストリンクの色を各クラスの設定を優先させたい

cssの質問です。 h1、h2などのタグや、各クラスのテキストの色をスタイルシートで設定してあります。 このうちの一部のテキストにリンクを張ると、当然共通のリンクテキスト色に変わってしまいます。 テキストリンクを張っても、hoverで下線を表示させるだけで、各タグやクラスで設定したテキスト色を保持したいのですが、何か指定する方法はないでしょうか。 各タグやクラス毎にlink色や下線を指定するしかありませんか?

  • HTML
  • 回答数1
  • ありがとう数1

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

  • ベストアンサー
回答No.1

color: inheritを使う方法が考えられます。 ただ、IE6はこれに対応してません。 IE6でも想定通りに表示するようにするには、結局個別に色指定が必要になりますね。 次のような感じでまとめて指定すれば、若干は手間が減るかもしれません。 h1, h1 a { color: #○○○; text-decoration: none; }

presshow
質問者

お礼

やっぱり個別でないとダメですか・・・ 有難うございます、助かりました。

関連するQ&A

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

    テキストの色を全体に統一したいのですが、リンク部分のみ指定にない色(青)になります。 <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
  • CSSでテキストリンクの色を複数指定したいのですが・・・

    はじめまして。 CSS勉強中なんですが、今CSSで作ったホームページでわからないことがあります。 テキストリンクの色をa:linkという直接タグにCSSを指定して統一しているんですが、なんとかしてそれぞれの場所にあったテキストリンクの色に指定できないものでしょうか? できればそれぞれを配置してあるdivごとに指定できると楽なんですが・・・

    • ベストアンサー
    • HTML
  • FireFoxのテキスト表示について

    フレーム、javascript、スタイルシート、cssファイル使いまくりなサイトですが、 FireFoxで表示すると、テキストにカーソルを置いた時に、 リンク時の状態になってしまいます。 具体的には、文字色が変わり、下線が表示されます。 これは、どうすれば解消できるでしょうか。 ちなみに、リンクの設定は下記の通りです。 リンク(訪問前)の指定 a:link{ color:#444444; text-decoration:none; } リンク(訪問済み)の指定 a:visited{ color:#444444; text-decoration:none; } リンク(カーソルを乗せた時)の指定 a:hover{ color:#c0c0c0; text-decoration:underline; } 良い解決方法がありましたら、よろしくお願いします。

  • リンクテキストの下線を消したい(dreamweaver)

    CSSを使ってリンクテキストの下線を消し、さらにテキストの色も変えたいのですが、CSSの設定の中を探しても見当たりません。教えてください。ちなみにバージョン6.0です。

  • 同一ページ内でリンクテキストの色を2パターン以上設定することはできますか。

    リンクテキストの色設定なのですが、通常 a:link { color:#18519E; text-decoration:underline;} などで指定することが できますが、同一ページ内でリンクテキストの色を2パターン以上設定することはできますか。 たとえば、りんご、という文字の上ではhoverで色が赤くなるが みかん、という文字の上ではhoverで色がオレンジになるなど。

    • ベストアンサー
    • HTML
  • リンクの線を消してもう一度表示したい。ところが・・・。

    DTIでブログを作成している者です。 「リンクの下線を消して、ポイントしたときだけリンクの線が出るようにしたい」と思っています。 リンクの線を消すには、 <STYLE TYPE="text/css"> <!-- A { text-decoration:none } --> </STYLE> と入力すればよいとHTML辞書に書いてありました。 リンクをポイントしたときに下線が出るようにするには、 <STYLE TYPE="text/css"> <!-- A { text-decoration:none } A:hover {color:#FF0000;text-decoration:underline;} --> </STYLE> とタグを打ち込めばOKと書いてありました。 ここで、「リンクの下線を消してポイントだけ表示させる」ため、上記の二つ目のタグを打ち込んで文章を書き、リンクを作ったのですが、「リンクの下線を消して、ポイントした時だけ」という形では表示されません。(プレビュー画面ではちゃんとそうなっているのですが、その後ブログ上で見ても、下線もなければ、ポイントしても下線が出てきません。IEでもスレイプニルでも同じです。)正しくはどうやればいいのでしょうか? あと、リンクごとによって「ポイントする前の最初の文字の色」を変更したいのですが、どのような順序でやればよいでしょうか?例えば最初ピンク色に設定したとして、その文章をリンクすると青文字になってしまいます。その場合、青色になった箇所のソースで、その単語の直前に<FONT color="#ff00ff">のタグを打ち込む、というやり方であってますか?教えてください!

  • divのクラス内のリンクの設定

     CSSの設定でわからない点がありましたので質問させてください。  div自体にクラスを設定しているのですが、このブロック内にリンクがあります。このdivないの<a href="">のみのCSS指定をしたいのですが、どうやってやったらよいのでしょうか?  これまでは、divにidを指定して、 #id a:link {… とか、アンカー自体にクラスを指定してやっていたのですが、ここではHTML自体を変更せずにCSSでコントロールしたいのです。 ソース自体はこんな風になっています。 <div class="asset-more-link"> <a href="example.html">バージョンアップ</a>の続きを読む </div> これに対して、あれこれCSSを設定したのですが一向に反応してくれません。もしわかる方がいたらおしえてください。よろしくお願いします。

    • ベストアンサー
    • CSS
  • リンクの色を2色で使い分けたい

    はじめまして。 良かったらどなたか教えて下さい。 今、一枚のページを作っているのですが、背景色を"#ffffff"(白)とし、そのリンクを以下の様に指定しました。 <style type="text/css"> <!-- A { text-decoration: none} A:link {color:#000000;} A:visited {color:#ffffff;} A:hover {color:#ff6600;} --> </style> 「白地に黒文字リンク、オンマウス時はオレンジ」という指定です。 ところが、同じページ内でテーブルを組み、その背景を#000000と指定する事になりまして、その中にリンクを入れると、「黒字に黒文字リンク、オンマウス時はオレンジ」 でリンクの文字が見えなくなってしまいます。 hoverの効果(オンマウス時はオレンジ)の効果を残しつつ、リンク色を二色に分ける方法は無いでしょうか? (クラス指定の使い方がよく判ってないので、自分で指定するとエラーしか出ないのです)。 お忙しい所申し訳ございませんが、宜しくお願い致します。

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

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

    • ベストアンサー
    • HTML
  • CSSでリンクの表示をテキストと画像で変えたい

    CSSを使って、 ・テキストのリンクのときは、 a:link で 常に点線のアンダーラインを表示 a:hover で マウスを重ねたとき色を変える ・画像のリンクのときは、  アンダーラインをださない  a:hoverの動作をさせない という風にしたいのですがうまくいきません。 a:link { color: black; text-decoration: none; border-bottom-width: 1px; border-bottom-style: dotted; border-bottom-color: #333333; } a:hover { background-color: black; text-decoration: underline; color:white; } といった指定をして、テキストからのリンクに適用しています。そのうえで、画像には上記の設定が生きないようにしたいと思っていますがうまくいきません。 .bordernone { border: none; } と書いて、リンクの画像に <img src="image/xx.jpg" class="bordernone" style="border-style:none"> などとしてもうまくいきません。 よろしくお願いいたします。

    • ベストアンサー
    • CSS

専門家に質問してみよう