我有以下代码,我想将菜单栏(页面换行)与内容对齐。 下面代码2行用于星级评定并显示星星。
<div id="content" float: left></div>
<div id="default"></div>
完整代码:
Rate this Site <span id="test"> </span>
<div id="content" float: left></div>
<div id="default"></div>
<span id="page-wrap">
<span id="content">
<ul id="nav">
<li><a href="#">Home</a></li>
<li><a href="#">Products</a>
<ul class="child">
<li><a href="#">LCD LED TV</a></li>
<li><a href="#">Garments</a></li>
<li><a href="#">Watches</a></li>
<li><a href="#">Laptops</a></li>
</ul>
</li>
<li><a href="#">Services</a>
<ul class="child">
<li><a href="#">Repairs</a></li>
<li><a href="#">Installations</a></li>
<li><a href="#">Setups</a></li>
</ul>
</li>
<li><a href="#">About</a></li>
<li><a href="#">Contact</a></li>
</ul>
</span>
</span>
的style.css
a { color: black }
/* Targeting both first and second level menus */
#nav li { float: left; position: relative; }
#nav li a { background: ; border: ; color: #333; display: block; margin: 0 5px 0 0; padding: 5px 8px; text-decoration: underline }
#nav li a:hover { background:; text-decoration: BOLD; }
/* Targeting the first level menu */
#nav { display: block; height: 35px; padding: 10px 0; width: 500px; z-index: 100; position: absolute;}
#nav > li > a { border-top-left-radius: 10px; border-top-right-radius: 10px; -moz-border-radius-topleft: 10px; -moz-border-radius-topright: 10px; -webkit-border-top-left-radius: 10px; -webkit-border-top-right-radius: 10px;}
/* Targeting the second level menu */
#nav li ul { background: ; border:; color: #333; display: none; margin: -3px 0 0 0; width: 200px; position: absolute; font-size:12px; }
#nav li ul li { width: 100% }
#nav li ul li a { background: none; border: none; line-height: 30px; margin: 0; padding: 0 0 0 5px; }
#nav li ul li a:hover { background: ; color:blue}
/* A class of current will be added via jQuery */
#nav li.current > a { background: ; }
/* CSS fallback */
#nav li:hover > ul.child { display: block; }
我希望我的菜单项与星形符号相同。