1

[Tab]キーのみでul/olスタイルのメニューのサブメニューを選択（アクティブ化）して、サブメニューが表示されるようにすることはできますか？

：focus疑似クラスを使ってみました

ul
    li
        a:focus
        +
        ul
            li
                a ...

サブメニューが選択されている場合：

ul
    li
        a (?)
        +
        ul
            li
                a:focus ...

しかし、CSSでアクティブノードを選択することはできません

これを確認してください：http：//jsfiddle.net/iegik/DKvH2/

4

2 に答える 2

1

submenue-itemにフォーカスがあるときに完全なサブメニューを表示したい場合、Javascriptなしでは方法がわかりません。それで十分な場合、フォーカスされた要素だけが表示されている場合は、次のように試すことができます。

.links > li:not(:hover) li a:focus {
    left: 9999em;
    position: relative;
}

これにより、フォーカスされた要素が本来あるべき場所に戻されます（これが：hover-pseudo-classを介してまだ行われていない場合）。

http://jsfiddle.net/DKvH2/1/

于 2012-10-22T12:54:42.953 に答える
1

tabindexがあなたのために働くかもしれません。

HTML

<ul class="links">
        <li tabindex="1">
            <a href="#i1">Item 1</a>
        </li>
            <li tabindex="2">
            <a href="#i2">Item 2</a>
            <ul class="links">
                <li><a href="#i2-1">Item 2.1</a></li>
                <li><a href="#i2-1">Item 2.2</a></li>
            </ul>
        </li>
    </ul>

CSS

.links > li:focus a + ul{top:auto}

このhttp://jsfiddle.net/DKvH2/3/の例を作成しました

これを読んでくださいhttp://css-tricks.com/expanding-images-html5/

于 2012-10-22T13:16:37.777 に答える