<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <meta name="Keywords" content="menu,中英文双语导航菜单" /> <meta http-equiv="Description" content="CSS实现中英文双语导航效果" /> <meta name="author" content="diyidu" /> <title>CSS实现中英文双语导航效果</title> <style type="text/css"> a{ color: #FFFF99; text-decoration: none; } a:hover{ color: #FFFFFF; text-decoration: underline; } #nav{ padding: 10px 10px 0; font-size: 12px; font-weight: bold; margin: 1em 0 0; list-style:none; } #nav li{ float: left; margin-right: 10px; } .diyidu{ position: relative; z-index: 0; } .diyidu:hover{ z-index: 99; } .diyidu:hover span{ visibility: visible; top: 0; left: 0; cursor: pointer; } .diyidu span{ position: absolute; left: -999em; visibility: hidden; } #nav li a,.diyidu:hover span{ line-height: 20px; text-decoration: none; background: #DDDDDD; color: #666666; display: block; width: 80px; text-align: center; margin: -0.3em 0 0; } #nav li a:hover,.diyidu:hover span{ color: #FFFFFF; background: #8FBF00; } .diyidu:hover span{ padding-top: 2px; } #navbar{ background: #8FBF00; height: 8px; overflow: hidden; clear: both; } </style> </head> <body> <div id="top"> <ul id="nav"> <li><a class="diyidu" href="#">Home<span>首页</span></a></li> <li><a class="diyidu" href="#">About me<span>关于我</span></a></li> <li><a class="diyidu" href="#">Tagcloud<span>标签云集</span></a></li> <li><a class="diyidu" href="#">Search<span>搜索</span></a></li> <li><a class="diyidu" href="#">Guestbook<span>留言本</span></a></li> <li><a class="diyidu" href="#">Admin<span>后台管理</span></a></li> </ul> <div id="navbar"></div> </div> </body> </html>
[ 提示：你可先修改部分代码，再按Ctrl+A 全部选择 ]
很不错的一款日期输入控件特效...
