묻고답하기
HTML 메뉴바 질문이 있습니다.
2014.11.11 12:03
HTML 메뉴바 질문이 있습니다.
드롭다운 메뉴를 만들어보려고 다른 분이 만드신 소스를 가지고 보고 있습니다.
아래와 같이 메뉴를 만들었는데 하위 메뉴가 나타나지 않는데 제가 어떤 실수를 했는지 봐주십시오.
(혹, XE 소스를 일반 HTML에 적용하려고 하면 안되는건가요?)
<HTML>
<div id="gnb_menu"> <ul class="gnb_ul"> <li class="active"> <a href="#" target="_blank">홈</a> <ul class="sub"> <li class="active"> <a href="#">1</a> </li> <li class="active"> <a href="#">2</a> </li> <li class="active"> <a href="#">3</a> </li> </ul> </li> </ul> </div>
<CSS>
/*menu*/
.header .menu .logo { width:200px; height:71px; float:left; margin-left:20px;}
.header .menu #gnb_menu { height:50px; float:left}
.header .menu #gnb_menu ul { list-style:none; padding:0; margin:0; }
.header .menu #gnb_menu .gnb_ul>li { position:relative; float:left; white-space:nowrap; }
.header .menu #gnb_menu .gnb_ul>li>a { font-size:20px; font-weight:bold; color:#ffffff; display:block; height: 45px; line-height: 45px; padding:0 21px; } /* 15px -> 20px */
.header .menu #gnb_menu .sub { display:none; position:absolute; top:45px; min-width:84px; background:url('./../img/blackglass.png'); padding:10px; z-index:10; }
.header .menu #gnb_menu .sub>li { font-size: 15px;height:20px; line-height:20px; padding-left: 15px; padding-right: 15px;text-align: center}
.header .menu #gnb_menu .sub>li>a { color:#fff; }
/*menu*/
.header .menu { width:75%; height:45px; margin:0 auto; background:#404040; }
.header .menu #gnb_menu .gnb_ul>li.active>a { background:#98B85E !important; color:#FFF; }
.header .menu #gnb_menu .gnb_ul>li>a:hover { background:#85A252 !important; color:#FFF; }