首页 > 代码库 > div+css登陆界面案例
div+css登陆界面案例
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <style type="text/css"> body{ margin: 0px; padding:0px; font-size:12px; background-color: #1873aa; text-align: center; overflow: hidden; } #style1{ background-image: url(images/left1.gif); width:165px; height: 28px; color: #FFFFFF; padding-top: 1px; } #style1 div{ margin-top:7px; margin-left: -15px; } #container{ width:165px; height: 500px; background-color: #FFFFFF; margin-left: 7px; } .style211{ background-image: url(images/left2.gif); width: 152px; height: 23px; margin-left: 9px; padding-top: 1px; } .style211 div{ margin-top: 2px; color: #FFFFFF; margin-left: -25px; } .style211 div a{ text-decoration: none; color: #FFFFFF; font-size: 13px; } .style212{ border: 1px solid #95d6e4; height: 120px; width: 151px; color: #033d61; text-align: left; font-size:15px; margin-left: 7px; } .style212 li{ padding: 3px; margin-left: -5px; } .style212 ul li a{ text-decoration: none; color: #033d61; } .style212 ul li a:hover{ text-decoration: underline; font-size: 16px; } </style> <script type="text/javascript"> function hiddenDiv(div){ div.style.display=(div.style.display == ‘none‘?‘block‘:‘none‘); } </script></head><body> <div id="container"> <div id="style1"> <div>管理菜单</div> </div> <div id="style2"> <div class="style21"> <div class="style211"> <div><a href="javascript:void(0)" onclick="hiddenDiv(document.getElementById(‘style212‘))">业务中心</a></div> </div> <div class ="style212" id="style212"> <ul> <li><a href="">短信群发</a></li> <li><a href="">短信群发</a></li> <li><a href="">短信群发</a></li> <li><a href="">短信群发</a></li> </ul> </div> </div> <div class="style21"> <div class="style211"> <div><a href="javascript:void(0)" onclick="hiddenDiv(document.getElementById(‘style213‘))">业务中心</a></div> </div> <div class ="style212" id="style213"> <ul> <li><a href="">短信群发</a></li> <li><a href="">短信群发</a></li> <li><a href="">短信群发</a></li> <li><a href="">短信群发</a></li> </ul> </div> </div> <div class="style21"> <div class="style211"> <div><a href="javascript:void(0)" onclick="hiddenDiv(document.getElementById(‘style214‘))">业务中心</a></div> </div> <div class ="style212" id="style214"> <ul> <li><a href="">短信群发</a></li> <li><a href="">短信群发</a></li> <li><a href="">短信群发</a></li> <li><a href="">短信群发</a></li> </ul> </div> </div> </div> </div> </body></html>
声明：以上内容来自用户投稿及互联网公开渠道收集整理发布，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任，若内容有误或涉及侵权可进行投诉： 投诉/举报 工作人员会在5个工作日内联系你，一经查实，本站将立刻删除涉嫌侵权内容。