html頁面：<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="zh-CN"> <head profile="http://gmpg.org/xfn/11"> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>FreeBSD</title> <link rel="stylesheet" type="text/css" media="all" href="./css/style.css"> <link rel="stylesheet" id="superfish-css" href="./css/superfish.css" type="text/css" media="all"> </head> <body> <div class="menu-header"> <ul id="menu-%e5%af%bc%e8%88%aa" class="nav sf-js-enabled"> <div id="home_btn"> <a href="#">首頁</a> </div> <li> <a href="#">風雨</a> </li> <li id="menu-item-92" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-92"> <a href="#">飄</a> </li> </ul> </div> </body> </html>
css檔案： /*** ESSENTIAL STYLES ***/ .nav, .nav * { margin: 0; padding: 0; list-style: none; } .nav { line-height: 1.0; } .nav ul { position: absolute; top: -999em; width: 13em; /* left offset of submenus need to match (see below) */ } .nav ul li { width: 100%; } .nav li:hover { visibility: inherit; /* fixes IE7 'sticky bug' */ } .nav li { float: left; position: relative; } .nav a { display: block; position: relative; } .nav li:hover ul, .nav li.sfHover ul { left: 0; top: 36px; /* match top ul list item height */ z-index: 99; } ul.nav li:hover li ul, ul.nav li.sfHover li ul { top: -999em; } ul.nav li li:hover ul, ul.nav li li.sfHover ul { left: 13em; /* match ul width */ top: 0; } ul.nav li li:hover li ul, ul.nav li li.sfHover li ul { top: -999em; } ul.nav li li li:hover ul, ul.nav li li li.sfHover ul { left: 13em; /* match ul width */ top: 0px; } /*** DEMO SKIN ***/ .nav { float: left; font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 14px; } .nav a { padding: 1em 1.1em 1em 1.1em; text-decoration:none; background: url("22.png") no-repeat -1px 0px; } .nav a, .nav a:visited { /* visited pseudo selector so IE6 applies text colour*/ color: #333; font-weight: 800; } .nav li { /*background: url("../images/menu_divider.png") no-repeat -1px 0px;*/ /*background: url("11.png") no-repeat -1px 0px;*/ } .nav li:hover a { color: #eee; } .nav li li a { background: #333; } .nav li li a:hover { text-decoration: underline; } .nav li ul { background: #000; } .nav li:hover, .nav li.sfHover, .nav a:focus, .nav a:hover, .nav a:active { outline: 0; color: #fff; background: #0088ff;/*滑鼠划過或者啟用*/ } .nav li ul li:hover, .nav li ul li.sfHover, .nav li ul li a:focus, .nav li ul li a:hover, .nav li ul li a:active { outline: 0; color: #fff; } .nav li.current_page_item, .nav li.current-cat { background: #333; } .nav li.current_page_item a, .nav li.current-cat a { color: #fff; }Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
