0

私は現在、いくつかのcssコードで問題に直面しています。私が達成しようとしているのは、誰かが、表示#triggerするdivのリンクにカーソルを合わせたとき#hiddenです。

<!DOCTYPE html>
<html>
<head>
    <title></title>
    <style type="text/css">
        #hidden {
            display: none;
            position: absolute;
            top: 20px;
            left: 100px;
            border: 1px solid red;
        }

        #trigger {
            border: 1px solid white;
            background: red;
        }
        #trigger:hover #hidden {
            display: block !important;
        }

    </style>
</head>
<body>

<div id="hidden">
    This hidden div.
</div>

<span id="trigger">
    <a href="#">Show</a>
</span>

</body>
</html>

このコードが機能しない理由を理解しようとしています。私は多くの場所で同様のコードを使用しましたが、それは問題なく機能しました。ここでの問題は何ですか？

4

2 に答える 2

2

divhiddenはdivにありませんtrigger。

CSSコードを次のように機能させることができます。

<span id="trigger">
    <a href="#">Show</a>

    <div id="hidden">
        This hidden div.
    </div>
</span>

ところで、絶対位置div（ ）は、またはを開始点（0、0）として#hidden、上部要素のxとyを取得することを考慮してください。存在しない場合は、ボディのxとyを取ります。poistion: relativeabsolute

于 2012-10-25T20:15:12.623 に答える
1

#hidden要素を要素内に配置する#triggerと、セレクターが機能します。

セレクター#trigger:hover #hiddenで を見つけようとしています#hidden。

于 2012-10-25T20:16:17.940 に答える