0

これに何時間も費やした後、以下の問題を試して分離しました。最初のリンクは、FF でホバーすると下線が引かれませんが、私が試した他のすべてのブラウザーで機能します。2 番目のリンクは Firefox でも適切に機能します。サイト上の既存の html のほとんどは以下のように構成されているため、サイト全体の修正を歓迎します。

HTML: (ここにコードとして貼り付けるとタグが削除されます) http://pastebin.com/duqfKGeY

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">


<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>
FF test
</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<link href="ff.css" rel="stylesheet" type="text/css" />
</head>
<body>
    <table>
        <tbody>
    <tr>
            <td>

        <ul type="disc">

                    <li>
            <a target="_blank" href="http://example1.com">
                <font size="2" color="#b80000"><b>Example Link 1</b></font></a>

                        <br>

            <font size="2" face="Verdana"> 

                example text  example text  example text  example text  example text  example text                  example text  example text  example text  example text  example text  example text                   example text  example text  example text  example text             example text 
                <a target="_blank" href="http://example2.com/">
                 <font size="2" face="Verdana" color="#b80000">Example link 2</font>
                </a>

                  example text  example text  example text  example text  example text  example text                    example text  example text  example text  example text  example text  example text  example text                example text  example text  example                 text  example text .
            </font> 
         </li>

        </ul>
        </td>
        </tr>
    </tbody>
</table>
</body>
</html>

CSS:

a{color:#b80000;}
a:link{color:#b80000;text-decoration:none;}
a:visited{color:#b80000;text-decoration:none;}
a:hover{color:#b80000;text-decoration:underline;}
a:active{color:#b80000;}

編集:W3C Validatorでエラーなしで検証します

4

5 に答える 5

1

さて、まず最初に、

レイアウト用の表 - 自習してください:

http://shouldiusetablesforlayout.com

http://www.hotdesign.com/seybold/

http://webdesign.about.com/od/layout/a/aa111102a.htm

http://www.htmlgoodies.com/beyond/css/article.php/3642151/CSS-Layouts-Without-Tables.htm

<font>タグはずっと前に廃止されましたが、現在は<span>すべてのスタイリングのニーズに CSS とタグを使用しています。

機能しない理由として最も可能性が高いのは、HTML が基本的に完全に間違っているためです。はい、機能しますが、interwebz を殺しているためです。<div>タグと CSS でレイアウトをやり直しました。きれいできれいで、誰もが満足しています。

ライブデモ

また-検証-これは単なるツールであり、目指すべき標準ではありません。バグを見つけるのに役立つことは確かですが、100%準拠しようとするのに苦労する可能性があります(XHTML Strictを見つめる)詳細はこちら:

http://net.tutsplus.com/articles/general/but-it-doesnt-validate/

于 2011-02-18T18:50:13.337 に答える
1

<B>タグはtext-decoration. これを追加するだけです:

a:hover b{text-decoration:underline;}

他にもある場合は、おそらく次のこともできます。

a:hover > *{text-decoration:underline;}
于 2011-02-18T21:40:40.007 に答える
0

問題はtext-decoration: underline;CSS ステートメントにある可能性があります。Firefox はバージョン 3.6 でこれを無視します。バージョン 7.0 では問題なく動作することはわかっていますが、実際にいつ修正されたのかはわかりません。

どのバージョンの Firefox を使用していますか?

于 2012-03-08T21:37:53.123 に答える
0

これは、私が使用するすべてのビットオーバーキルです:

a{text-decoration:none;} a:hover{text-decoration:underline;}

これが機能しない理由はないはずです。

于 2011-02-18T18:25:45.953 に答える
0

FF 3.6/Mac の両方のリンクに :hover の下線が表示されます。リンクが訪問済みの場合でも同様です。

Alex Thomas が指摘したように、CSS はより簡潔にすることができます。すべてのリンク状態が同じ色であり、:hover 状態のみが下線によって異なることを考慮してください。

Google Docs の粗末な HTML では、これらのfontタグに色が指定されていますが (レトロですね?)、CSS で色のルールを複製して、:hover の下線が正しい色で表示されるようにします。

a {
color: #b80000;
text-decoration:none;
} 
a:hover{ text-decoration:underline;}
于 2011-02-18T20:46:41.260 に答える