【韩国风俗娘系高清】韩国风格css横向导航菜单代码

更新时间：2016-04-01 来源：导航菜单手机版 字体：大中小

【www.bbyears.com--导航菜单】

提示：您可以先修改部分代码再运行

韩国风格css横向<a href="http://www.bbyears.com/clist-203-1.html" target="_blank" class="keylink">导航菜单</a>代码
<style>
#menu {padding:0; margin:0; list-style:none; width:546px; height:180px; background:url(http://www.111cn.net/demo/pic/bw.jpg); position:relative; float:right;}
#menu li {float:left;}
#menu li a {display:block; width:78px; height:100px; background:transparent;}
#menu li a b {position:absolute; left:-9999px;}

#menu li#home,
#menu li#dropdown,
#menu li#flyout,
#menu li#contact
{margin-top:23px;}
#menu li#single,
#menu li#dropline,
#menu li#support
{margin-top:3px;}

#menu li#home a:hover {background:url(http://www.111cn.net/demo/pic/color.jpg) 0 -23px;}
#menu li#single a:hover {background:url(http://www.111cn.net/demo/pic/color.jpg) -78px -3px;}
#menu li#dropdown a:hover {background:url(http://www.111cn.net/demo/pic/color.jpg) -156px -23px;}
#menu li#dropline a:hover {background:url(http://www.111cn.net/demo/pic/color.jpg) -234px -3px;}
#menu li#flyout a:hover {background:url(http://www.111cn.net/demo/pic/color.jpg) -312px -23px;}
#menu li#support a:hover {background:url(http://www.111cn.net/demo/pic/color.jpg) -390px -3px;}
#menu li#contact a:hover {background:url(http://www.111cn.net/demo/pic/color.jpg) -468px -23px;}

.home #menu li#home a, .home #menu li#home a:hover, #menu li#home a:active, #menu li#home a:focus {background:url(http://www.111cn.net/demo/pic/white.jpg) 0 -23px;}
.single #menu li#single a, .single #menu li#single a:hover, #menu li#single a:active, #menu li#single a:focus {background:url(http://www.111cn.net/demo/pic/white.jpg) -78px -3px;}
.dropdown #menu li#dropdown a, .dropdown #menu li#dropdown a:hover, #menu li#dropdown a:active, #menu li#dropdown a:focus {background:url(http://www.111cn.net/demo/pic/white.jpg) -156px -23px;}
.dropline #menu li#dropline a, .dropline #menu li#dropline a:hover, #menu li#dropline a:active, #menu li#dropline a:focus {background:url(http://www.111cn.net/demo/pic/white.jpg) -234px -3px;}
.flyout #menu li#flyout a, .flyout #menu li#flyout a:hover, #menu li#flyout a:active, #menu li#flyout a:focus {background:url(http://www.111cn.net/demo/pic/white.jpg) -312px -23px;}
.support #menu li#support a, .support #menu li#support a:hover, #menu li#support a:active, #menu li#support a:focus {background:url(http://www.111cn.net/demo/pic/white.jpg) -390px -3px;}
.contact #menu li#contact a, .contact #menu li#contact a:hover, #menu li#contact a:active, #menu li#contact a:focus {background:url(http://www.111cn.net/demo/pic/white.jpg) -468px -23px;}

</style>

<ul id="menu">
			<li id="home" class="first">Home
			<li id="single">Single Level
			<li id="dropdown">Dropdown
			<li id="dropline">Dropline
			<li id="flyout">Flyout
			<li id="support">Support
			<li id="contact" class="last">Contact

提示：您可以先修改部分代码再运行

本文来源：http://www.bbyears.com/wangyetexiao/22837.html

链接：http://www.bbyears.com/wangyetexiao/22837.html
【韩国风俗娘系高清】韩国风格css横向导航菜单代码(转载时请注明本文出处及链接)

猜你感兴趣

[css超出部分省略号]css 定义表单代码 2016-04-01
css div布局的基本步骤|纯css+div经典导航菜单代码 2016-04-01
【js导航菜单】js导航菜单特效-变化背景 2016-04-01
[css div 居中]css+div 横向二级菜单代码 2016-04-01
json|js 邮箱验证代码 2016-04-01
[js横向导航菜单]js横向导航菜单特效 2016-04-01
[seo推广彳金手指*排名专业]seo快速排名搜索的上升率 2016-04-01
百度快照推广_百度快照倒退原因和解决办法 2016-04-01
【百度开发者平台】百度K站之前兆与解决方案 2016-04-01
[网站关键字的选择技术]网站关键字的选择及SEO 2016-04-01

本类排行

本类最新

更多>>

【韩国风俗娘系高清】韩国风格css横向导航菜单代码

猜你感兴趣

热门标签

本类排行

本类最新