代码简介:来自Individuality纯CSS打造的笔记本样式的菜单导航,还记得初中时记笔记的笔记本样式吗
代码内容:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" " xmlns=">来自Individuality纯CSS打造的笔记本样式的菜单导航_网页代码站( type="text/css"> #menu {list-style: none;padding: 0;margin: 0;width: 774px;height: 210px;background: url() no-repeat;position: relative;}#menu span {display: none;position: absolute;}#menu a {display: block;text-indent: -900%;position: absolute;outline: none;}#menu a:hover {background-position: left bottom;}#menu a:hover span{display: block;}#menu .home {width: 144px;height: 58px;background: url() no-repeat;left: 96px;top: 73px;}#menu .home span {width: 86px;height: 14px;background: url() no-repeat;left: 28px;top: -20px;}#menu .about {width: 131px;height: 51px;background: url() no-repeat;left: 338px;top: 97px;}#menu .about span {width: 40px;height: 12px;background: url() no-repeat;left: 44px;top: 54px;}#menu .rss {width: 112px;height: 47px;background: url() no-repeat;left: 588px;top: 94px;}#menu .rss span {width: 92px;height: 20px;background: url() no-repeat;left: 26px;top: -20px;} </style></head><body><ul id="menu"><li><a href="#" class="home">Home<span></span></a></li><li><a href="#" class="about">About<span></span></a></li><li><a href="#" class="rss">RSS<span></span></a></li></ul><p></p></body></html><br><p><a href="">网页代码站</a> - 最专业的代码下载网站 - 致力为中国站长提供有质量的代码!</p>
更多信息请查看IT技术专栏