61,110
社区成员
发帖
与我相关
我的任务
分享
<!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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>导航条</title>
<link href="css.css" rel="stylesheet" type="text/css" />
<style type="text/css">
<!--
#nav {
PADDING: 0 10px; OVERFLOW: hidden; BORDER: #ccc 1px solid; ZOOM: 1; margin: 5px auto
}
#nav UL {
FLOAT: left; PADDING-LEFT: 2px; OVERFLOW: auto; ZOOM: 1; LIST-STYLE-TYPE: none
}
#nav UL LI {
FLOAT: left; MARGIN-LEFT: -1px
}
#nav UL LI A {
BORDER-RIGHT: #898989 1px solid; BORDER-TOP: #898989 1px solid; BORDER-LEFT: #898989 1px solid; BORDER-BOTTOM: #898989 0px solid; DISPLAY: block; PADDING-RIGHT: 1em; PADDING-LEFT: 1em; PADDING-BOTTOM: 3px; PADDING-TOP: 3px; BACKGROUND: #f1f1f1; MIN-WIDTH: 60px; COLOR: #333; TEXT-ALIGN: center; font-size:12PX; text-decoration: underline
}
* HTML #nav UL LI A {
WIDTH: 60px; WHITE-SPACE: nowrap
}
* + HTML #nav UL LI A {
PADDING-RIGHT: 1em; PADDING-LEFT: 1em; PADDING-BOTTOM: 2px; PADDING-TOP: 4px
}
#nav A:hover {
BACKGROUND: #d8dfea; TEXT-DECORATION: none
}
#nav .selected {
Z-INDEX: 99; POSITION: relative
}
#nav .selected A {
BORDER-RIGHT: #5973a9 1px solid; BORDER-TOP: #3b5888 1px solid; BACKGROUND: #6d84b4; BORDER-LEFT: #5973a9 1px solid; COLOR: #fff; BORDER-BOTTOM: #3b5888 0px solid; TEXT-DECORATION: none
}
#nav .selected A:hover {
TEXT-DECORATION: none
}
#box{ WIDTH: 850px; MARGIN:0 auto; border: #83B4FF 1px solid;}
-->
</style>
</head>
<body>
<div id="box">
<div id="nav">
<UL>
<LI class="selected"><A href="#">模板分类</A></LI>
<LI><A href="#">1111</A></LI>
<LI><A href="#">2222</A></LI>
<LI><A href="#">3333</A></LI>
<LI><A href="#">4444</A></LI>
<LI><A href="#">5555</A> </LI>
<LI><A href="#">6666</A></LI>
</UL>
</div></div></body></html>