div+css纵向导航如何实现且为导航添加超链接
div+css纵向导航如何实现且为导航添加超链接
发布时间:2016-12-27 来源:查字典编辑
摘要:以下代码实现纵向导航功能,并为导航添加了超链接(用#不可用的超链接代替),如下图所示无标题文档body{font-family:Verdan...

以下代码实现纵向导航功能,并为导航添加了超链接(用#不可用的超链接代替),如下图所示

<!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=gb2312" />

<title>无标题文档</title>

<style type="text/css">

body{font-family:Verdana;font-size:18px;line-height:1.5;}

a{color:#000;text-decoration:none;}

a:hover{color:#F00;} //hover是为鼠标经过时字体颜色变为红色

#menu{width:100px;border:1px solid#CCC}

#menu ul{list-style:none;margin:0px;padding:0px;}

#menu ul li{background:#eee;padding:0px 8px;height:26px;line-height:26px;border-bottom:1px solid #CCC}

</style>

</head>

<body>

<div id="menu">

<ul>

<li><a href="#">首页</a></li>

<li><a href="#">货源信息</a></li>

<li><a href="#">车源信息</a></li>

<li><a href="#">专线信息</a></li>

<li><a href="#">服务信息</a></li>

<li><a href="#">新闻资讯</a></li>

</ul>

</div>

</body>

</html>

推荐文章
猜你喜欢
附近的人在看
推荐阅读
拓展阅读
相关阅读
网友关注
最新 Div+Css教程学习
热门 Div+Css教程学习
网页设计子分类