css - cssでドロップダウンメニューを上から固定する方法は？

Question

http://www.homeshop18.com/にあるようなドロップ メニューを css のみで、特に jquery を使用せずにすべてのカテゴリメニューを作成したいと考えています。上部の 2 番目のレベルのメニュー。任意の提案をいただければ幸いです。

Answer 1

質問を投稿した方法から問題が何であるかを理解できませんが、投稿したサイトのメニューのように機能する CSS のみを使用してまとめたクイック メニューを次に示します。

HTML:

<ul class="main">
    <li>all
        <ul class="sub">
            <li>books
                <ul class="sub2">
                    <li>fiction</li>
                    <li>biography</li>                    
                </ul>
            </li>
            <li>mobile
                <ul class="sub2">
                    <li>android</li>
                    <li>cmda</li>                    
                    <li>battery</li>
                </ul>
            </li>            
        </ul>    
    </li>
</ul>​

CSS:

li {
 border:1px solid;
 padding:1px;
}

.main {
 list-style:none;
 position:relative;    
}

.sub, .sub2 {
 list-style:none;
 position:absolute;  
 display:none;
 width:75px;    
}

.sub2 { 
 float:left;
 left:75px; 
 top:0px;    
}

.main li:hover .sub,
.sub li:hover .sub2{
 display:block;    
}