-1

CSSドロップダウンメニューを作成するためのチュートリアルに従っています。しかし、ボタンが隣り合っている上部ではなく、1つのボタンが他のボタンの上にある左側に表示されるようにする方法があるかどうか疑問に思っていました。

4

3 に答える 3

2

チュートリアルを使用して学習している場合は、垂直メニューのチュートリアルに従ってみませんか? メニュー内のアイテムの配置が異なるだけでなく、子要素の配置も大きく異なります。あなたのような水平メニューを作成している場合、要素を互いの上に移動しても、親がホバー/クリックされたときに同じ「ドロップダウン」がある場合、それらの子要素は他のメニュー項目を覆い隠します.

これは垂直メニューのチュートリアルの例ですが、他にもたくさんあります。 http://www.devinrolsen.com/pure-css-vertical-menu/

于 2012-12-10T16:51:25.607 に答える
2

この CSS プロパティを削除または変更する必要があります。

nav ul li {
    float: none;
}
于 2012-12-10T16:52:23.907 に答える
0

あなたが提供したリンクに基づいて、垂直メニューのjsFiddleを作成しました。ファンシーなグラデーション、パディング、丸みを帯びた角をすべて削除し、ほんの少しの色のみを使用し、残りはすべて機能的な CSS です。

各メニュー項目は、次の CSS を使用してサブメニューのルートにすることができます。

nav li {
     position: relative;
}
nav ul ul {
     position: absolute;
     top: 0;
     left: 100%;
}

このようにして、任意の深さのメニューを作成できます。

于 2012-12-10T17:12:35.590 に答える