类似按钮效果的网站导航CSS代码

Mail:wang[A]9designer.com change[A] to @
Name:Wang QQ:409841693
I love to design beautiful websites.Find out more about me here.

Post by xyj1235, 2010-6-12, Views:

<!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" lang="en-US"><head><title>Lists as navigation</title><meta http-equiv="content-type" content="text/html; charset=utf-8" /><style type="text/css">#navigation {font-size:90%}#navigation ul {list-style: none;margin: 0;padding: 0;padding-top: 1em;}#navigation li {display: inline;}#navigation a:link, #navigation a:visited {margin-right: 0.2em;padding: 0.2em 0.6em 0.2em 0.6em;color: #A62020;background-color: #FCE6EA;text-decoration: none;border-top: 1px solid #FFFFFF;border-left: 1px solid #FFFFFF;border-bottom: 1px solid #717171;border-right: 1px solid #717171;}#navigation a:hover {border-top: 1px solid #717171;border-left: 1px solid #717171;border-bottom: 1px solid #FFFFFF;border-right: 1px solid #FFFFFF;}</style></head><body><div id="navigation"><ul><li><a href="#">Recipes</a></li><li><a href="#">Contact Us</a></li><li><a href="#">Articles</a></li><li><a href="#">Buy Online</a></li></ul></div></body></html>

Tags: CSS DIV

分类:CSS+HTML | 评论:0 | 引用:0 | 点击这里获取该日志的TrackBack引用地址 | 获取流量

上一篇：淘宝网站长谈网站推广之创意篇
下一篇：如果朝鲜战争爆发，中国也将动武

或许你还对下面的文章感兴趣

CSS技巧 (2010-4-23 16:55:24)
多浏览器兼容HACK (2010-4-22 11:27:19)
页面制作面试常遇问题 (2010-4-22 11:25:11)
图片与文居中方法 (2010-4-22 11:21:46)
用CSS把网站变灰 (2010-4-22 11:18:54)
CSS网页布局优点与缺点 (2010-4-20 12:24:29)
命名技巧 (2010-4-19 15:37:24)
IE6图片出现白框的解决方法 (2010-4-17 12:22:40)
CSS简单而易犯的错误 (2010-4-17 12:18:45)
10个常用CSS技巧 (2010-4-17 12:17:3)

Comments

发表评论:

◎欢迎参与讨论，请在这里发表您的看法、交流您的观点。