天天看點
傳回

float實作橫向導航

<html>
<head>
<style>
ul {
	float:left;//整個清單向左浮動
	width:100%;
	margin:0;
	padding:0;
	}
a {
	text-decoration:none;
	color:#fff;
	font-size:20px;
	text-align:center;
	line-height:1.5em;
	background-color:#999;
	border-right:solid #FFF 1px;
	float:left;
	width:5em;
	}
li {
	display:inline;//行内顯示
	}
a:hover {
	background-color:#CCC;//滑鼠指向改變背景
</style>
</head>
<body>
<ul>
<li><a href="#" target="_blank" rel="external nofollow"  target="_blank" rel="external nofollow"  target="_blank" rel="external nofollow" >first</a></li>
<li><a href="#" target="_blank" rel="external nofollow"  target="_blank" rel="external nofollow"  target="_blank" rel="external nofollow" >second</a></li>
<li><a href="#" target="_blank" rel="external nofollow"  target="_blank" rel="external nofollow"  target="_blank" rel="external nofollow" >third</a></li>
</ul>
</body>
</html>
float實作橫向導航
HTML+CSS 導航 css 橫向導航
上一篇: 縱向導航css設定主要屬性,CSS 導航Hello World Example of sticky navigation barHello WorldWelcome to the lidihuo.comWelcome to the lidihuo.com
下一篇: CSS網頁布局縱向導航菜單

繼續閱讀