• ベストアンサー

リンクの色、下線などの変更

しなちくと申します。よろしくお願いします。 ただいま個人HPを作成していまして、リンクについて質問です。 オンマウスでリンクの文字色が変わり、かつ、オンマウスで下線を消したいのですが、どのようにしたらいいでしょう…? ページ全体ではなく、テーブルの中だけの効果にしたいのですが… ご回答、お待ちしておりますm(_ _)m

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

  • ベストアンサー
  • ORUKA1951
  • ベストアンサー率45% (5062/11036)
回答No.2

スタイルシートですから、<head>~</head>内か、外部スタイルシートに書きます。  ここで書くには長すぎますので はじめてのWebドキュメントづくり「色を変えてみたりする」 http://www.asahi-net.or.jp/%7Esd5a-ucd/www/coloring.html とか、 CSS解説 http://anslasax.net/css-make/index.html などで勉強してください。  しかし、 「当方、知識が乏しく調べてみたものの成功するに至りませんでしたorz」 は、深刻です。貴方が参考にされている本かサイトは間違っている可能性が大です。すくなくとも、とんでもない遠回りをしている。  参考にあげたサイトのトップ はじめてのWebドキュメントづくり http://www.asahi-net.or.jp/%7Esd5a-ucd/www/ を最初に読んでください。  HPとは、世界的にはヒューレッドパカッード社の商標です。ホームページの略という意味だと想像しますが、ホームページの本来の意味はブラウザを起動したときに最初に表示されるページです。「ホームページをどこに設定していますか?」 『僕はGoogle』『私Yahoo』『俺はブックマーク』  貴方の場合、 「ただいま個人ウェブサイトを作成していまして、リンク(の表示方法について)について質問です。」  という意味です。ウェブを利用する限りにおいてはさして問題になりませんが、自分がサイトの構築者となると、とても困ったことになります。  なお、サンプルコードは、全角スペースを含んでいます。このサイトの仕様で行頭の半角スペースは消されるからです。必ずタブなり半角スペースに書き換えて利用してください。 【HTMLの唯一よりどころにすべき資料】 HTML 4.01 仕様書(邦訳) http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html401j/cover.html スタイルシートとHTMLの関係はについては、この仕様書の 14 スタイルシートにあります。 http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html401j/present/styles.html

sinatiku2
質問者

お礼

確かに調べ方ちょっと変だったかもしれないです。サイトの方、大変勉強になりました。 重ね重ね、本当にありがとうございました!

その他の回答 (2)

回答No.3

下記の方々の回答が正解ですが、sinatiku2さんはあまり詳しくないようななので、補足させて頂きます。 一番簡単な方法は、HTMLソースの<HEAD>~</HEAD>の間に下記をコピペしてください -------------------------------------------------- <style type="text/css"> <!-- a:hover.tdlink { color: #FF0000; text-decoration:none; background-color: #FFFF00; } --> </style> -------------------------------------------------- 『color: #FF0000;』がオンマウス時の文字色 『text-decoration: none;』でオンマウスで下線を消す 『background-color: #FFFF00;』これはオンマウスで文字に背景色をつけるタグなので、消しても構いません。 それから、この効果を反映させたいリンクのタグに『class="tdlink"』と追記してください。 ↓例 -------------------------------------------------- <A href="***.html" class="tdlink">ここをクリック!</A> -------------------------------------------------- これで『class="tdlink"』を追記したリンクにだけご希望の効果が反映されます。

sinatiku2
質問者

お礼

ご回答ありがとうございます! コピペで試させていただきまして、成功いたしました。ありがとうございます! これから少しずつでも勉強して、せめてご回答いただいた事は理解できるようになりたいと思いますm(_ _)m

  • ORUKA1951
  • ベストアンサー率45% (5062/11036)
回答No.1

tableの子要素に別途スタイルシートを設定します。 こんな感じです。 table a:link{  color: rgb(0,0,255);  background-color: inherit; } table a:visited{  color: rgb(0,0,136);  background-color: inherit; } table a:hover{  color: rgb( 0,136,255);  background-color: inherit;  text-decoration: none; } table a:active{  color: rgb( 155,0,255);  background-color:black; } table a[name]:hover{  color: inherit;  background-color: inherit; } ★分かりやすくするため全角スペースでインデントさせています。  利用するときはタブに変換すること ってとこかな。<a na,e="">がある場合は、クラスセレクタとリンクの擬似セレクタで指定しておくこと。リンク擬似セレクタはこの順番で・・

sinatiku2
質問者

お礼

遅くなりましてすみません、ご回答ありがとうございました! 丁寧にご回答いただいて恐縮なのですが、当方、知識が乏しく調べてみたものの成功するに至りませんでしたorz <table cellspacing="0" width="75%" border="1"> <tr> <td> </td> </tr> </table> の、どこに挿入すればいいのでしょうか…? よろしければお願いいたします。

関連するQ&A

  • リンクの色を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
  • HTML/リンクの下線をなくす

    いつもお世話になっています。 Decooというサイトを利用しています。 コメントや次ページ、前ページに進むリンクがあるのですが、 リンク文字に下線がついているのですが、その下線をなくしたいです。 リンクの下線をなくすHTMLタグがあるらしいのですが よくわからないので、教えていただきたいです。 リンクごと(個別)にそのタグを入れるのでなく、 そのタグ以降のリンクは全て下線がなくなるタグを教えていただきたいです。 宜しくお願いします。

  • 下線なしのリンクは?

    初歩的な質問で申し訳ありません。 <a href>のタグで文字にリンクを張ると下線がついてしまいますよね? 下線なしでリンクを張ってあるHPを見かけますが、どうやっているのでしょうか? ソースを見ても<a href>タグを使っているようですが…。

    • ベストアンサー
    • HTML
  • リンクの下線を消して表示させる方法

    HPビルダー7を使っています。 色々な文字を打って、そこにリンクを貼ると、下線が表示されてしまいますよね? それを表示しないようにさせて、マウスを乗せると下線が現れるようにしたいのですが、どうしたらよいでしょうか。

  • ホームページのリンク作成して下線消したい

    ホームページのリンク作成について。 文字にリンクをつけたいのですが、リンクの下線を消して、文字を黒色で表示させたいのですが、やり方教えてください。

    • ベストアンサー
    • HTML
  • CSSで指定したリンクのみに下線

    現在CSSを使ってHPを作成しています。全体的にはリンクには下線を引かないように下記のように指定しました。 a:link{color:#523e35;text-decoration:none;} しかし、リンク色とテキスト色を同じにしたいので同じにしましたがどこにリンクが貼ってあるのか分かりません。 とりあえず、ホームページ内メニューの部分のみはリンクが張ってあるか把握できるようメニューのリンク部分だけにでも下線を引きたいのです。 試しに .menu_line { text-decoration: underline; } 上記をつかって<div class="menu_line">でメニューを囲ってみるとリンクの部分ではなく、テキストの部分にのみ下線がひかれてしまいました。 いったいどう指定すればメニューの部分のリンクにのみ下線を引くことができるでしょうか…。 ご存知の方がいれば教えていただきたいです。 よろしくお願いします。

    • ベストアンサー
    • HTML
  • CSS ある場所だけリンク時に下線表示

    タイトルの通りなのですが、ページ全体ではなく 特定の場所のテキストリンクにオンマウスしたら 下線が表示されるようにしたいんです。 スタイルシートの書き方にとまどっており、 <div style="~"> で始めて </div> で閉じ、 a:link {color: #ffffff; text-decoration: none} a:hover {color: #ffffff; text-decoration: underline} を使うところまではわかるのですが…。 どなたか正しい記述を教えていただけないでしょうか?

  • スタイルシートと画像リンクの下線

    現在HPを作成しています。 スタイルシートで、ページ内指定で、リンクについて下線を表示させています。テキストから下線を少し離したいので以下のような記述をしています。 A:link{text-decoration:none;border-bottom-style:solid;border-width:1px;padding-bottom:0.3p x;color:#000000;} そして、そのページ内にある画像からもリンクを設定したいのですが、画像には下線がついて欲しくないのです。 何かよい方法がありますでしょうか? よろしくお願いします。

    • ベストアンサー
    • HTML
  • HTMLでリンクが貼ってある文字の下線を消したい

    現在、HTML言語を使用して楽天ショップのwebページを作成しています。 ある文字にリンクを貼ると文字の下に線が出ます。(みなさんも同様だと思いますが) 私がやりたいことは、HTML言語で下線を表示せずにマウスポインタがのった時だけ線を表示したいと思っています。 調べたところCSSなら簡単にできそうなのですが、やはりHTMLだとできないのでしょうか?教えてください。

    • ベストアンサー
    • HTML
  • リンク設定の際に付けられる下線を取り除く方法についての質問です。

    リンク設定の際に付けられる下線を取り除く方法についての質問です。 ホームページビルダーV9.0でディーラーご紹介のページを作成しましたが、リンク設定の際、下線が付いてしまい小さな字が見にくくなるので、下線を取り除きたいのですが、その方法を教えてください。 (デイーラー紹介ページ http://www.taiyotoryo.co.jp/dealer.html)

専門家に質問してみよう