• 締切済み

CSS、ｓｐａｎを使用しての下線

ＣＳＳのｓｐａｎを使用して下線を引く方法を探しています。 <span class="A">あいうえお</span> 「あいうえお」の部分に、フォーカスを合わせた時だけ、文字と同じ色のアンダーラインを引きたいと思っています。　a:hover　{text-decoration: none｝の逆に近いものだと思っていただければ幸いです。 「あいうえお」はリンクではありません。フェイク用に至急必要となり、探しております。 この方法をご教授くださればと思っています。

みんなの回答

回答No.1

単純に .A:hover { text-decoration:underline; } では駄目なのでしょうか

  1. カテゴリ
  2. インターネット・Webサービス
  3. その他（インターネット・Webサービス）

関連するQ&A

  • リンクの下線や色の指定を特定のところだけ設定したい

    HTMLページ内で、いくつもあるリンクの中で、特定の箇所だけ 下線を付けない onMouseの時だけ下線を付ける 色をデフォルト以外の色を付ける ようにしたいのですが、どのようにしたらいいでしょうか。 たとえばこの下はむちゃくちゃですが、 .link { font-size:12pt; color:#BF0000; font-weight: bold; text-decoration:none; a:link, a:visited { text-decoration: none; } a:hover { text-decoration: underline; }} こんな感じでスタイルシートに書いて <a href="xxxx.html"><span class="link">click</span></a> みたいな感じでも少しずつ変えながらいろいろ試してみたのですが 色やonMouse以外の時の下線なしはできたのですが、onMouse時の下線付きがうまくいきません。 どうすればよいかご存じの方ご教授ください。

    • ベストアンサー
    • HTML
  • マウスを重ねたら下線が出る

    マウスを重ねたら下線が出るようにしたいので こちらタグを改造してもらえませんか？ <a href="" style=text-decoration:none;a:hover:text-decoration:underline>test</a>

  • CSSについて

    カーソルがルンク先文字にふれた時に色が変わり、 リンクしたあとリンク済みになるCSS( スタイルシート)はこれでいいでしょうか？ リンク済みの色が変わりません。 <!-- <style type="text/css"> --><!--A:HOVER{position : relative;top:2px;　left:2px;} </style> --> <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>

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

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

  • CSSで指定したリンクのみに下線

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

    • ベストアンサー
    • HTML
  • CSSの優先順位

    CSSを一部適用しない部分を設定したいのですが方法が分かりません。 もしかすると、私のやりたいことはCSSの順位付けかもしれません。 ▼基本▼ a:link {color:赤;text-decoration:none;} a:visited {color:青;text-decoration:none;} a:hover {color:黄;text-decoration:none;} a:active {color:緑;text-decoration:none;} ▲基本▲ 一方、下記のテキストには上記CSSの効果はいらないです。ここのテキストはリンクを貼っても文字の色（基本色：黒）を変化させず、下線もつけたくありません。 <td style="border:1px solid gray;" onmouseover="this.style.backgroundColor=紫" onmouseout="this.style.backgroundColor=白">ホーム</td> 「基本」を記述をすると、もちろんリンクをつけたすべてのテキストに適用されてしまいます。 しかし「基本」を一部適用したくない場所に不適用とすると下線とかも勝手につきますよね。 2番目に優先させるものとして↓を記述すべきですか？ a:link {color:黒;text-decoration:none;} a:visited {color:黒;text-decoration:none;} a:hover {color:黒;text-decoration:none;} a:active {color:黒;text-decoration:none;} そもそも優先順位のつけかたが分からないのですが…。 色々考えましたが、何をすべきか分かりません。よろしくお願いします。

  • リンクの下線と文字の間隔を開けるには

    ブログでやりたいんですが、教えてください。調べてみると、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
  • 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の下線指定が反映されない

    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;} --> 当方初心者でして詳しい方にご教授いただきたいです。 宜しくお願いいたします。

  • 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

注目のQ&A

カテゴリ

専門家に質問してみよう

職業から探して質問する

あなたにピッタリな商品が見つかる！ OKWAVEセレクト

質問する