码迷,mamicode.com
首页 > Web开发 > 详细

用css实现列表菜单的效果

时间:2015-04-02 14:55:53      阅读:145      评论:0      收藏:0      [点我收藏+]

标签:

<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="Generator" content="EditPlus®">
<meta name="Author" content="">
<meta name="Keywords" content="">
<meta name="Description" content="">
<title>Document</title>
</head>
<body>

<style type="text/css">
a:hover{ background:blue; background-repeat:no-repeat;}   <!--鼠标放在链接上变颜色-->
div.header
{
text-decoration:none;
color:white;
background-color:gray;
clear:left;
border:0;<!--去掉链接下划线-->
}
h1.header
{text-decoration:none;<!--去掉链接下划线-->
padding:8px;
margin:0;
border:0;<!--去掉链接下划线-->
}
a{text-decoration:none;}
</style>
</head>
<body>
<!--加载链接-->

<div class="header"><h1 class="header"><a href="/index.html">首页</a> <a href="/index.html"> 学习论坛</a> <a href="/index.html">学员问答</a><a href="/index.html"> IT圈子</a><a href="/index.html"> 实时课堂</a><a href="/index.html"> 客户端下载</a><a href="/index.html"> 帮助</a></h1>
</div>
<div id="menu">
<ul>
<li><a href="#">首 页</a></li>
<li><a href="#">学习论坛</a></li>
<li><a href="#">学员问答</a></li>
<li><a href="#">IT圈子</a></li>
<li><a href="#">实时课堂</a></li>
<li><a href="#">客户端下载</a></li>
<li><a href="#">帮助中心</a></li>
</ul>
</div>


</body>
</html>

用css实现列表菜单的效果

标签:

原文地址:http://www.cnblogs.com/FG123/p/4386846.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!