您的位置:首页 > 运维架构 > 网站架构

用CSS设计网站导航——横向导航

2013-07-15 11:10 411 查看
<!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" />

<style>

#nav {width:860px; margin:0 auto;background:#ccc}

#nav li { float:left;}

#nav li a { color:#000000; text-decoration:none; padding-top:4px; display:block; width:120px; height:22px; text-align:center; background-color:#ececec; margin-left:2px;}

#nav li a:hover { background-color:#bbbbbb; color:#ffffff;}

</style>

</head>

<body>

  <ul id="nav">

    <li><a href="/index.asp">主页</a></li>

    <li><a href="/Sort/List_4.html">DIV+CSS教程</a></li>

    <li><a href="/Sort/List_5.html">常用代码</a></li>

    <li><a href="/Sort/List_6.html">水晶图标</a></li>

    <li><a href="/Sort/List_7.html">幻灯图片</a></li>

    <li><a href="/Sort/List_10.html">软件下载</a></li>

    <li><a href="/css2/">CSS2.0实用手册</a></li>

  </ul>

</body>

</html>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: