首页  >  文章  >  web前端  >  js怎么在导航栏互相切换中英文

js怎么在导航栏互相切换中英文

php中世界最好的语言
php中世界最好的语言原创
2018-04-18 16:54:402291浏览

这次给大家带来js怎么在导航栏互相切换中英文,js在导航栏互相切换中英文的注意事项有哪些,下面就是实战案例,一起来看一下。

ul的高度为li的一半,ul{overflow:hidden}

li:hover{margin-top:-40px;}





中英切换导航条

*{padding:0; margin:0;}
li{ list-style:none; }
a{ text-decoration:none;}
.nav{ width:100%; height:40px; background:#222; margin-top:100px; overflow:hidden;}
.list{ width:1000px; height:40px; margin:0 auto;}
.list li{ float:left;}
.list li a{ display:block; transition:0.3s;}
.list b,.list i{ display:block; padding:0 30px; color:#aaa; line-height:40px; text-align:center;}
.list b{ font-weight:100}
.list i{ font-style:normal; background:#333; color:#fff;}
.list a:hover{ margin-top:-40px;}




 
 
  •      Index   首页     
  •  
  •      course   职业课程     
  •  
  •      study   就业学习     
  •  
  •      BBS   社区     
  •  
  •      JiKe+   发现+     
  •  

    相信看了本文案例你已经掌握了方法,更多精彩请关注php中文网其它相关文章!

    推荐阅读:

    JS实现棋盘覆盖

    js寄生组合式继承使用详解

    以上是js怎么在导航栏互相切换中英文的详细内容。更多信息请关注PHP中文网其他相关文章!

    声明:
    本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn