位置：首页 > 设计 > 网页设计

CSS如何实现中英文双语菜单效果代码

网页设计2.73W

CSS如何实现中英文双语菜单效果呢?以下是小编为你提供的'代码，希望可以为您带来帮助!

这是一款你一定喜欢的CSS中英文双语菜单，支持鼠标特效，先运行一下看效果，绝对会另你满意。用到了一个背景图片，请自行下载。

代码如下:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

"">

<head>

<title>实用的中英文CSS菜单</title>

<style>

body{

margin:0;

padding:0;

font-size:12px;

}

{

margin:0;

padding:0;

text-align:left;

color:#9196A0;

font-family:Verdana;

}

color:#9196A0;

}

a:link {

text-decoration: none

}

a:visited{

text-decoration: none

}

a:hover{

text-decoration:underline;

color:#81BC06

}

#nav{

height:100%;

overflow: hidden;

list-style:none;

margin:0 auto;

width:798px

}

#nav li{

float:left;

font-weight:bold;

height:60px;

background:url(images/navbg.png) #fff repeat-x left bottom;

padding:0

}

#nav a{

text-align:center;

padding-top:20px;

display: block;

height:40px;

line-height:40px;

}

#nav li {width:80px;}

#nav li e{width:80px;}

#nav li {width:80px;}

#nav li {width:100px;}

#nav li {width:106px;}

#nav li n{width:100px;}

#nav li t{width:80px;}

#nav li {width:92px;}

#nav li a:hover.one{background:url(images/navunbg.gif) no-repeat -8px 0}

#nav li a:hover.two{background:url(images/navunbg.gif) no-repeat -8px -60px}

#nav li a:hover.three{background:url(images/navunbg.gif) no-repeat -8px -120px}

#nav li a:hover.four{background:url(images/navunbg.gif) no-repeat -8px -180px}

#nav li a:hover.five{background:url(images/navunbg.gif) no-repeat 4px -240px}

#nav li a:hover.six{background:url(images/navunbg.gif) no-repeat 8px -300px}

#nav li a:hover.seven{background:url(images/navunbg.gif) no-repeat 4px -360px}

#nav li a:hover.eight{background:url(images/navunbg.gif) no-repeat -8px -420px}

#nav li a:hover.nine{background:url(images/navunbg.gif) no-repeat 0 -480px}

</style>

</head>

<body>

<li><a href="#" class="five">建站服务流程</a></li>

<li><a href="#" class="seven">网站使用指南</a></li>

</ul>

荟萃馆

CSS如何实现中英文双语菜单效果代码

有关JavaScript中的prototype.bind()方法介绍

如何理解Javascript的caller,callee,call,apply区别

JavaScript基本语法分析

网页设计很糟糕的10个原因

相关文章