탐색 용 CSS

HTML 탐색 기반 요구 사항이 있습니다. 드롭 다운을 www.microsoft.com에 갈 때의 모양과 유사하게 표시하려면 어떻게해야합니까? 예 : www.microsoft.com으로 이동하여 제품을 클릭하면 같은 드롭 다운 창에 제품 목록이 표시되고 다른 열에 Entertainment 목록이 표시됩니다. 이것을 위해 CSS를 어떻게 만들 수 있습니까? 이것은 내가 내 경우에는탐색 용 CSS

<ul> 
    <li> 
    <a href="link" target="">Home</a> 
    </li> 
    <li> 
    <a href="link" target="">Menu 1</a> 
     <ul> 
     <li> 
      <a href="link" target="">Sub Menu 1</a> 
      <ul> 
       <li> 
       <a href="link" target="">sub Menu 1a </a> 
       </li> 

       <li> 
      <a href="link" target="">sub Menu 1b </a> 
       </li> 

       <li> 
       <a href="link" target="">sub Menu 1c </a> 
       </li> 
      </ul> 
      </li> 

     <li> 
     <a href="link" target="">Sub Menu 2</a> 
       <ul> 
        <li> 
        <a href="link" target="">sub Menu 2a </a> 
        </li> 

        <li> 
       <a href="link" target="">sub Menu 2b </a> 
        </li> 

        <li> 
        <a href="link" target="">sub Menu 2c </a> 
        </li> 
       </ul> 
      </li> 

      <li> 
      <a href="link" target="">Sub Menu 3</a> 
        <ul> 
         <li> 
         <a href="link" target="">sub Menu 3a </a> 
         </li> 

         <li> 
        <a href="link" target="">sub Menu 3b </a> 
         </li> 

         <li> 
         <a href="link" target="">sub Menu 3c </a> 
         </li> 
        </ul> 
     </li> 
    </ul> 
    </li> 
     <li> <a href="link" target="">Menu 2</a> 
     <ul> 
      <li> <a href="linl" > sub Menu 1 </a> </li> 
      <li> <a href="link2"> sub Menu 2 </a> </li> 
     </ul> 
     </li> 

    </ul>

그래서이 사람이 메뉴 하나를 클릭 할 때 드롭 다운 창에서 하위 메뉴 1을 표시해야하고 그 아래 하위 메뉴 1A, 1B, 1C를 표시하고 하위 메뉴 2를 보여줄 것입니다 아래에 하위 메뉴 2a, 2b, 2c를 보여줍니다 ... 그리고 메뉴 항목이 길면 여러 열로 표시해야합니다.이 요구 사항을 충족시키는 예제 CSS가 있습니까?

출처

2011-12-21 gechu

세 링크 전용 답변. 무슨 일이야? –