css로 메뉴만들기
css만으로 간단히 메뉴를 만들수 있다.
가상클래스 :hover, display 사용
예시
| <style type="text/css"> ul.mn { } ul.mn li { position:relative; float:left; padding:0 20px; font:normal 14px/30px "나눔고딕", "돋움", "굴림";} ul.mn li ul { display:none; position:absolute; top:30px; left:0; } ul.mn li:hover ul { display: inline; } ul.mn li ul li { font:normal 12px/20px "나눔고딕", "돋움", "굴림"; } </style> <ul class="mn"> <li><a href="#">대메뉴</a> <ul class="submn"> <li><a href="#">2뎁스</a></li> <li><a href="#">2뎁스</a></li> <li><a href="#">2뎁스</a></li> </ul> </li> <li><a href="#">대메뉴</a> <ul class="submn"> <li><a href="#">2뎁스</a></li> <li><a href="#">2뎁스</a></li> <li><a href="#">2뎁스</a></li> </ul> </li> </ul> |
