- Div+Css设计竖直菜单
1. 效果
2. css代码
#navigation
{
width:150px;
}
#navigation ul
{
list-style-type: none;
margin: 0px;
padding: 0px;
}
#navigation li a
{
display: block;
padding: 3px 6px 3px 6px;
border: 1px solid #00FF00;
}
#navigation li a:link a:visited
{
background-color: #c11136;
color: #FFFFFF;
}
#navigation li a:hover
{
background-color:#990020;
color:#ffff00;
}
3.网页代码
<head runat="server">
<link href="CSS/h.css" rel="stylesheet" type="text/css" />
<title>This is title</title>
</head>
<body>
<form id="form1" runat="server">
<div id="navigation">
<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>
</ul>
</div>
</form>
</body>
- Div+Css设计水平菜单
只需要将上例中的css代码中加入
#navigation li
{
float:left;
}
代码就可以实现水平菜单显示。效果如下图：
1294
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
