纯CSS 无序列表打造的网站导航菜单_html-js-css

概述网(LieHuo.Net)教程三行的纯CSS网站导航栏菜单，改改风格，让大家感到新鲜一点，其它主要还是使用了Li列表，整体布局简洁，美观大方，适合大部分网站使用，颜色和菜单空隙可随意调节，希望大家喜欢。<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http:/…

　　内存溢出 jb51.cc 三行的纯CSS网站导航栏菜单，改改风格，让大家感到新鲜一点，其它主要还是使用了li列表，整体布局简洁，美观大方，适合大部分网站使用，颜色和菜单空隙可随意调节，希望大家喜欢。

<!DOCTYPE HTML PUBliC "-//W3C//DTD xhtml 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-Transitional.dtd"><HTML xmlns="http://www.w3.org/1999/xhtml"><head><Meta http-equiv="Content-Type" content="text/HTML; charset=utf-8" /><Title>多行的导航栏</Title><style type="text/CSS">* { margin:0; padding:0; }body { Font:12px/180% Verdana,Geneva,sans-serif; }li { List-style:none; }a { text-decoration:none; color:#999; }a:hover { color:#900; text-decoration:underline; }.nav_sub { wIDth:700px; margin:0 auto; height:1%; overflow:hidden; margin-bottom:10px; background:#EDEEEF; }.Title_nav_sub { display:block; padding:3px 20px; text-align:center; background:#48862F; color:#fff; float:left; }.nav_sub ul { float:left; }.nav_sub ul li { display:inline; }.nav_sub ul a { float:left; padding:3px 20px; }.more { float:right; }</style></head><body><div class="nav_sub"><span class="Title_nav_sub">源码</span><ul><li><a href="#" Title="lIEhuo.net">ASP</a></li><li><a href="#" Title="lIEhuo.net">PHP</a></li><li><a href="#" Title="lIEhuo.net">JsP</a></li><li><a href="#" Title="lIEhuo.net">DELPHI</a></li><li><a href="#" Title="lIEhuo.net">VS</a></li><li><a href="#" Title="lIEhuo.net">AJAX</a></li><li><a href="#" Title="lIEhuo.net">Jquery</a></li></ul><a href="#" Title="lIEhuo.net" class="more">更多>></a> </div><div class="nav_sub"><span class="Title_nav_sub">特效</span><ul><li><a href="#" Title="lIEhuo.net">导航菜单类</a></li><li><a href="#" Title="lIEhuo.net">CSS布局类</a></li><li><a href="#" Title="lIEhuo.net">表单及按钮</a></li><li><a href="#" Title="lIEhuo.net">图片切换</a></li><li><a href="#" Title="lIEhuo.net">鼠标特效</a></li></ul><a href="#" Title="lIEhuo.net" class="more">更多>></a> </div><div class="nav_sub"><span class="Title_nav_sub">文章</span><ul><li><a href="#" Title="lIEhuo.net">ASP教程</a></li><li><a href="http://www.wfuyu.com/" Title="lIEhuo.net">站长资讯</a></li><li><a href="#" Title="lIEhuo.net">PHP技术</a></li><li><a href="#" Title="lIEhuo.net">SEO</a></li><li><a href="#" Title="lIEhuo.net">其它</a></li></ul><a href="#" Title="lIEhuo.net" class="more">更多>></a> </div></body></HTML><br /><center>如不能显示效果，请按Ctrl+F5刷新本页，更多网页代码：<a href='http://www.wfuyu.com/' Title="lIEhuo.net" target='_blank'>http://www.wfuyu.com/</a></center>
提示：可修改后代码再运行!

总结

以上是内存溢出为你收集整理的纯CSS 无序列表打造的网站导航菜单全部内容，希望文章能够帮你解决纯CSS 无序列表打造的网站导航菜单所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。

欢迎分享，转载请注明来源：内存溢出

原文地址: http://outofmemory.cn/web/1021188.html

纯CSS 无序列表打造的网站导航菜单

发表评论

评论列表（0条）