2011-07-14 154 views
1

我遇到了CSS菜單的麻煩。我正在Joomla上開發網站。 我會在這裏發佈CSS和HTML代碼,以便您可以將其複製到文件中。CSS菜單和html問題

<html> 

<head> 
    <link rel="stylesheet" href="style.css" type="text/css" media="screen" /> 
</head> 
</body> 
<div class="left-menu"> 
    <ul class="menu-winery"> 
     <li class="parent active item5"> 
      <a href=""><span>ღვინო</span></a> 
      <ul> 
       <li class="parent active item6"> 
        <a href=""><span>TELIANI VALLEY</span></a> 
        <ul> 
         <li class="item7"> 
          <a href=""><span>ლეგენდა</span></a> 
         </li> 
         <li id="current" class="parent active item8"> 
          <a href=""><span>ღვინოები</span></a> 
          <ul> 
           <li class="active item10"> 
            <a href=""><span>ქვევრის</span></a> 
           </li> 
           <li class="item51"> 
            <a href=""><span>დაძველებული</span></a> 
           </li> 
           <li class="item52"> 
            <a href=""><span>სამშვენისი</span></a> 
           </li> 
           <li class="item53"> 
            <a href=""><span>ადგილწარმოშობის</span></a> 
           </li> 
           <li class="item54"> 
            <a href=""><span>ჯიშური</span></a> 
           </li> 
           <li class="item55"> 
            <a><span>სადესერტო</span></a> 
           </li> 
          </ul> 
         </li> 
         <li class="item9"> 
          <a href="javascript:;"><span>ჯილდოები</span></a> 
         </li> 
        </ul> 
       </li> 
       <li class="item57"> 
        <a><span>MOSSANO DEPUIS 1893</span></a> 
       </li> 
       <li class="item58"> 
        <a><span>TELURI</span></a> 
       </li> 
       <li class="item59"> 
        <a><span>OLD GRUZIA</span></a> 
       </li> 
       <li class="item60"> 
        <a><span>GRUZIA</span></a> 
       </li> 
       <li class="item61"> 
        <a><span>KVARELI</span></a> 
       </li> 
       <li class="item62"> 
        <a><span>LAZURI</span></a> 
       </li> 
      </ul> 
     </li> 
     <li class="item63"> 
      <a><span>ცქრიალა ღვინო</span></a> 
     </li> 
     <li class="item64"> 
      <a><span>ჭაჭა</span></a> 
     </li> 
     <li class="item65"> 
      <a><span>ქართული ბრენდი</span></a> 
     </li> 
    </ul> 
</div> 
</body> 
</head> 

而這裏的CSS代碼:

.menu-winery { margin:0; padding:0; width:145px; list-style:none; } 
.menu-winery li a { font: normal 12px/20px sylfaen, calibri, Georgia, "Times New Roman", Times, serif; color:#7b212b; display:block; 
    text-decoration:none; text-indent: 10px; margin-bottom: 1px; } 
.menu-winery li a:hover { background-color: #7b212b; color:#fff; } 
.menu-winery li.active a { background-color: #7b212b; color:#fff; } 

.menu-winery li ul { margin:0; padding:0; list-style:none; } 
.menu-winery li ul li { text-indent: 20px; } 
.menu-winery li ul li a { background-color: #fff; font: normal 12px/20px sylfaen, calibri, Georgia, "Times New Roman", Times, serif; 
    color:#808285; display:block; text-transform:uppercase; text-decoration:none; margin-bottom: 1px; } 
.menu-winery li ul li a:hover { background-color: #887b32; color:#fff; }   
.menu-winery li ul li.active a { background-color: #887b32; color:#fff; width:200px; height:20px; }  

.menu-winery li ul li ul { margin:0; padding:0; list-style:none; } 
.menu-winery li ul li ul li a { background-color: #fff; font: normal 12px/20px sylfaen, calibri, Georgia, "Times New Roman", Times, serif; 
    color:#cbbc9a; display:block; text-transform:uppercase; text-decoration:none; text-indent: 28px; margin-bottom: 1px; } 
.menu-winery li ul li ul li a:hover { background-color: #cbbc9a; color:#fff; }  
.menu-winery li ul li ul li.active a { background-color: #cbbc9a; color:#fff; }  

.menu-winery li ul li ul li ul { margin:0; padding:0; list-style:none; } 
.menu-winery li ul li ul li ul li a { background-color: #fff; font: normal 12px/20px sylfaen, calibri, Georgia, "Times New Roman", Times, serif; 
    color:#887b32; display:block; text-transform:uppercase; text-decoration:none; text-indent: 33px; margin-bottom: 1px; } 
.menu-winery li ul li ul li ul li a:hover { background-color: #e2dec9; color:#fff; list-style:none; } 
.menu-winery li ul li ul li ul li.active a { background-color: #e2dec9; color:#fff; list-style:none; } 

所以在這裏,我需要和李肇星的活躍狀態的問題。如果我把積極的類放到A標籤,一切正常。但在joomla我必須做一個主菜單模塊的overide(我必須知道在那裏改變什麼......)

也許任何人都知道如何解決這個問題。當Active Li被設置時,其內部的所有子ul都會獲得父母的顏色。

任何人都可以幫我解決這個問題嗎?

+0

可以添加您的Joomla的鏈接?可能這是一個特殊問題。 – Sotiris

+0

http://telianivalley.com/new/index.php?option=com_telianiwines&view=winelegendlist&catid=1&Itemid=7 <---這是鏈接...在這個版本中,我刪除了與活動的CSS。不想讓它看起來醜陋。 – mrGott

回答

0

的Joomla用來活躍菜單項的ID #current,所以儘量

.menu-winery li#current a { background-color: #7b212b; color:#fff; } 
+0

我認爲這會有相同的效果,但值得嘗試。但在這個項目的情況下Joomla不顯示ID電流,這也是一個有趣的事實,爲什麼它不顯示ID =「當前」..也許你知道... – mrGott