- 締切済み
a:hoverの下線指定が反映されない
htmファイルのheadタグ内に以下のようなCSSの記述をしていますが、なぜかa:hoverのunderlineの部分だけが反映されません。 <style type="text/css"> <!-- img { vertical-align: bottom; } img { border-style:none; } a:hover img{ opacity:0.6; filter:alpha(opacity=60); -ms-filter: “alpha( opacity=80 )”; } a{ text-decoration:none;} a:hover { text-decoration:underline;} --> 当方初心者でして詳しい方にご教授いただきたいです。 宜しくお願いいたします。
- k_sazan_k
- お礼率50% (1/2)
- HTML
- 回答数2
- ありがとう数8
- みんなの回答 （2）
- 専門家の回答
関連するQ&A
- a:hoverの下線指定が反映されない
htmファイルのheadタグ内に以下のようなCSSの記述をしていますが、なぜかa:hoverのunderlineの部分だけが反映されません。はじめは一部のリンク箇所だけが反映されなかったのですが、訪問済みになった箇所がどんどん反映されなくなってしまい、しまいにはすべての箇所が反映されなくなりました。ただし、それはunderlineのみでfont colorやboldはしっかり反映されているのです。 これはなぜでしょうか？ ちなみにscriptの記述は一切していません。 最初は同様の記述を外部ファイルにしていたのですが うまく読み込めていないのかと思って、htmファイル内に 記述しましたがダメだったというわけです。 <style type="text/css"> <!-- body { font-size: 10.5pt; line-height: 130%} table { font-size: 10.5pt; line-height: 130%} a:hover{ text-decoration: underline; color: #FF0080; font-weight: bold} a:active { text-decoration: none} a:link { text-decoration: none} a:visited { text-decoration: none} --> アドバイスお願いいたします。
- ベストアンサー
- HTML
- a:hoverについて
リンク毎に「a:hover」のスタイルを変更したいのですが、 a:link { text-decoration: none; color: blue; } a:visited { text-decoration: none; color: blue; } a:hover { text-decoration: underline; color: red; } 通常は↑のスタイルで、 a[aaa]:hover { text-decoration: underline; color: blue; } nameを指定したリンクの場合は↑にしたい。 <a name="aaa" href="～">リンク</a> このような感じだと、上のリンクにカーソルを持っていっても青に変わってくれません。 どーすれば良いでしょうか？
- ベストアンサー
- HTML
- リンクの下線を破線にしているのですが…
リンクの下線を破線にするスタイルシートを使用しているのですが、 通常の左寄せや<center>タグで囲ったテキストでは正常に動作するのに、 <div align="right">または<p align="right">で囲った右寄せのテキストには破線が表示されません。 どうすれば表示されるようになるでしょうか。 私が使用しているスタイルシートは以下の通りです。 <style type="text/css"> <!-- A:link {color:#666666; text-decoration:none; border-bottom:1px dashed #00CCCC;} A:visited {color:#666666; text-decoration:none; border-bottom:1px dashed #00CCCC;} A:hover {color:#FF3300; text-decoration:none; border-bottom:1px dashed #00CCCC;} --> </style>
- ベストアンサー
- その他（インターネット・Webサービス）
- マウスを重ねたら下線が出る
マウスを重ねたら下線が出るようにしたいので こちらタグを改造してもらえませんか？ <a href="" style=text-decoration:none;a:hover:text-decoration:underline>test</a>
- 締切済み
- HTML
- a:hover img.●●について
お問い合わせフォームの送信ボタンを画像にして、 ロールオーバーイメージ風に画像ボタンにカーソルを 合わせると光るようにしたいのですが、うまくいきません。 ご教示いただけたら、助かります。 【以下cssタグ】 a:hover img.over { opacity: 0.6; filter: alpha(opacity=60); -ms-filter: "alpha( opacity=60 )"; } 【以下htmlタグ】 <div class="over"> <p><input type="image" src="http://●●/images/button.gif" alt="送信する" width="177" height="42"></p></div>
- ベストアンサー
- CSS
- リンクの下線と文字の間隔を開けるには
ブログでやりたいんですが、教えてください。調べてみると、padding-bottom: px らしいんですけど、うまくいきません。リンクの部分は次のような記述（ライブドア）になっているんですが、どう書き換えればいいのでしょうか。 a{color:#666;text-decoration:underline;} a:link{color:#666;text-decoration:underline;} a:visited{text-decoration:underline;} a:active{} a:hover{background-color:orange;text-decoration:none;} よろしくおねがいします
- ベストアンサー
- HTML
- xhtmlでページを作ったらcssのhoverの部分がFirefoxで
xhtmlでページを作ったらcssのhoverの部分がFirefoxでは動くのにIEでは上手く動きません。 どうしたらいいのでしょうか？ --xhtml-- <div class="menu"> <ul> <li><a href="#"target="content">link1</a><br/></li> <li><a href="#"target="content">link2</a><br/></li> <li><a href="#"target="content">link3</a><br/></li> </ul> </div> --css-- .menu{ width:100%; position:absolute; bottom:25%; font-weight:bolder; filter: alpha(opacity=70); -moz-opacity:0.70; opacity:0.70; } .menu ul{ margin:0; padding:0; } .menu li{ margin-bottom:1px; list-style-type:none; float:none; font-size:1.3em; line-height:0; } .menu li a{ display:block; width:100%; line-height:25px; background-color:#ba2029; color:#ffffff; text-align:center; text-decoration:none; border-left:solid 10px #880000; } .menu li a:hover{ background-color:#95195a; }
- ベストアンサー
- HTML
- CSS、おかしいですか？
CSSですが、本を見てやっています。 下記のように記述したのですが、書かなくてもよい記述とか、おかしいところ、ありますでしょうか？ <style type=text/css> body{font-size:10pt} td {font-size:10pt; line-height:12pt} tr {font-size:10pt line-height:12pt} dive {font-size:10pt;line-height:12pt} a:link {font-size:10pt; font-weight:normal; font-style:normal; text-decoration:underline; text-align:left; vertical-align:; color:#990000} a:visited {font-size:10pt; font-weight:normal; font-style:normal; text-decoration:underline; text-align:left; vertical-align:; color:#990000} a:active {font-size:10pt; font-weight:normal; font-style:normal; text-decoration:underline; text-align:left; vertical-align:; color:#ff0099} a:hover {font-size:10pt; font-weight:normal; font-style:normal; text-decoration:underline; text-align:left; vertical-align:; color:#ff0099} </style>
- 締切済み
- CSS
- 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 "ＭＳ Ｐゴシック",平成角ゴシック,</style>とやってもダメでした と
- ベストアンサー
- HTML
- borderでa:hover下線表示させるとズレる
underline では雰囲気に合わないため、border-bottomでホバー時のリンク下線を表示させています。具体的には以下のような感じです。 a {color: 青; text-decoration: none;} a:hover {color: 赤; text-decoration: none; border-bottom: dotted 1px 赤;} これでほとんど問題ないのですが、まれにホバー時にガタッと表示がズレることがあります。よく分からないのですが、ちいさなdiv要素を連続させている部分で起こるような気がします。リンクにマウスオーバーすると、続くdiv部分が下線分？下に動く感じです。 説明がうまくできているか分かりませんが、解決策があったら教えてください。ちいさなことですが、結構気になってしまいます。
- ベストアンサー
- HTML
お礼
回答ありがとうございます。 a:hover { text-decoration:underline;} のかわりに a img{border:none;} a:hover{border-bottom:solid 1px red;} を入れれば良いのでしょうか、当方初心者でして理解できずに申し訳有りません。