绿色下划线的简洁CSS导航代码

时间:2007-09-17 12:51:00 

一个不错的绿色下划线的简洁CSS导航代码,纯css不用图片,效果图如下:


<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>绿色下划线的简洁CSS导航代码 - asp之家</title>
<style>
body{background-color:#292929;font-family:Arial, Helvetica, sans-serif;font-size:12px;text-align:center}
#navcontainer{width:778px}
#navlist
  {
   margin: 0;
   padding: 0 0 20px 20px;
   border-bottom: 1px solid #444;
  }
  #navlist ul, #navlist li
  {
   margin: 0;
   padding: 0;
   display: inline;
   list-style-type: none;
  }
  #navlist a:link, #navlist a:visited
  {
   float: left;
   line-height: 14px;
   margin: 0 10px 4px 10px;
   text-decoration: none;
   color: #999;
  }
  #navlist a:link#current, #navlist a:visited#current, #navlist a:hover
  {
   border-bottom: 1px solid #76B41C;
   padding-bottom: 5px;
   background: transparent;
   color: #fff;
  }
  #navlist a:hover { color: #EEEE; }
</style>
</head>
<body>
<p> </p>
<p> </p>
<div id="navcontainer">
<ul id="navlist">
<li><a href="https://www.aspxhome.com/" target="_blank" id="current">Link 01</a></li>
<li><a href="https://www.aspxhome.com/" target="_blank">Link 02</a></li>
<li><a href="https://www.aspxhome.com/" target="_blank">Link 03</a></li>
<li><a href="https://www.aspxhome.com/" target="_blank">Link 04</a></li>
<li><a href="https://www.aspxhome.com/" target="_blank">Link 05</a></li>
<li><a href="https://www.aspxhome.com/" target="_blank">Link 06</a></li>
<li><a href="https://www.aspxhome.com/" target="_blank">Link 07</a></li>
<li><a href="https://www.aspxhome.com/" target="_blank">Link 08</a></li>
<li><a href="https://www.aspxhome.com/" target="_blank">Link 09</a></li>
</ul>
</div>
</body>
</html>


标签:导航,下划线
0
投稿

猜你喜欢

  • 详解PHP结构型设计模式之桥接模式Bridge Pattern

    2023-05-25 06:58:55
  • 关于SQL中CTE(公用表表达式)(Common Table Expression)的总结

    2012-08-21 10:22:21
  • asp实现新评论自动发短信提示的代码

    2011-03-07 10:38:00
  • 15个梦幻的登录页面设计展示

    2009-07-19 14:17:00
  • [hta]一个定时重启或关闭计算机的小工具

    2007-10-17 12:02:00
  • ASP/php/aspx生成静态网页的方法

    2007-10-25 12:01:00
  • IE8 在元素尺寸大于(2048px/4096px)时 alpha滤镜渲染失败

    2010-01-05 16:39:00
  • Linux PHP连接MSSQL

    2011-06-02 12:01:00
  • aspjpeg 添加水印教程及生成缩略图教程

    2011-04-04 11:04:00
  • 框架和框架之间的关系

    2008-01-17 18:54:00
  • 用自定义html标签让IE支持html 5新增元素

    2008-03-18 12:57:00
  • 精细讲述SQL Server数据库备份多种方法

    2009-01-13 13:33:00
  • 无序列表 li ul

    2008-07-29 13:00:00
  • Microsoft Access 数据库常规规格

    2007-09-27 19:28:00
  • 关于textarea的直观换行

    2010-03-18 15:59:00
  • prototype.js1.4版开发者手册

    2007-09-30 14:09:00
  • 浅谈MySQL的存储引擎之表类型存储

    2011-05-05 08:10:00
  • 关于window.opener的用法

    2008-02-23 11:03:00
  • centos 安装mysql中遇到问题的解决办法

    2010-12-14 15:11:00
  • Web脚本开发语言比较

    2007-08-22 17:32:00
  • asp之家 网络编程 m.aspxhome.com