Мне нужно добавить подменю в мое меню css

Я хочу, чтобы мое подменю сдвигалось вправо в горизонтальном направлении, я пробовал другое меню css, но это создает проблему на моей веб-странице. это мой HTML страница менюМне нужно добавить подменю в мое меню css

<li class="widget"> 
    <h2>Categories</h2> 
    <ul> 
     <li><a href="index.php" title="Category 1">All </a></li> 
     <li><a href="search.php?category=Groceries" title="Category 1">Groceries</a></li> 
     <li><a href="search.php?category=Personal_care" title="Category 2">Personal Care</a></li> 
     <li><a href="search.php?category=Dining" title="Category 5">Dining</a></li> 
     <li><a href="search.php?category=entertainment" title="Category 7">Entertainment</a></li> 
     <li><a href="search.php?category=travel" title="Category 6">Travel </a></li> 
     <li><a href="search.php?category=Books_Magazine" title="Category 3">Books &amp; Magazine</a></li> 
     <li><a href="search.php?category=clothing" title="Category 4">Clothing</a></li> 
     <li><a href="search.php?category=Sport_Fitness" title="Category 9">Sport &amp; Fitness</a></li> 
     <li><a href="search.php?category=other" title="Category 11">Other</a></li> 
     <li></li> 
    </ul> 
</li>

и это мой CSS для меню, как я могу добавить CSS для создания drowp вниз подменю в правой

.widget { padding-bottom: 16px; } 
.widget h2 { 
    height: 37px; 
    line-height: 37px; 
    background: url('images/widget-title.png') no-repeat 0 0; 
    font-family: 'Museo500', arial, sans-serif; 
    font-size: 18px; 
    color: #fff; 
    font-weight: normal; 
    padding: 0 9px 5px 22px; 
} 
.widget li a { 
    background: #6692C6; 
    line-height: 26px; 
    height: 26px; 
    padding-left: 23px; 
    font-size: 13px; 
    border-bottom: 1px solid #fff; 
    color: #EEEEEE; 
    display: block; 
} 
.widget li.last a { border: none; } 
.widget li a:hover { 
    color: #333333; 
    background: #fff; 
    text-decoration: none; 
    font-weight: bold; 
}

источник

2013-04-01 Dilan Dilshan

Я не уверен, что вы имеете в виду, сдвинув вправо. Не могли бы вы рассказать. Также см. Скрипку http://jsfiddle.net/gbutv/2/, это вы имеете в виду? – vdua

В моем css нет ни одного css, написанного для выпадающего подменю, я имею в виду, если пользователь нажимает на меню одежды или на мыши, я хочу, чтобы выпадающее подменю как мужская одежда, женская одежда, вот что я хочу сказать спасибо –

ОК! Тогда я совершенно неправильно понял ваш вопрос. Для этого вам нужно иметь немного javascript – vdua

посмотреть, как это работает

HTML

<li class="widget"> 
<h2>Categories</h2> 
<div class='subMenu'> 
<ul> 
    <li><a href="index.php" title="Category 1">All </a></li> 
    <li><a href="search.php?category=Groceries" title="Category 1">Groceries</a></li> 
    <li><a href="search.php?category=Personal_care" title="Category 2">Personal Care</a</li> 
</ul> 
</div> 
</li>

CSS

.subMenu{ 
display:none; 
} 
.widget:hover .subMenu{ 
display:block; 
}

скрипку

click here

источник

2013-04-01 06:33:01 Venugopal

Мне нужно добавить подменю в мое меню css

ответ

Смежные вопросы