利用CSS span实现双语菜单的方法教程


  主要是用CSS的span标签来实现,其实看了代码你会觉得,原来实现双语菜单如此简单。

CSS Code复制内容到剪贴板
  1. <!DOCTYPE html PUBLIC"-//W3C//DTD XHTML 1.0 Transitional//EN""http://www.phpstudy.net/TR/xhtml1/DTD/xhtml1-transitional.dtd">   
  2. <html xmlns="http://www.phpstudy.net/1999/xhtml">   
  3. <head>   
  4. <title>CSS实现的中英文双语菜单</title>   
  5. <style type="text/css">   
  6. ul {   
  7.  list-style-typenone;   
  8. }   
  9. li {   
  10.  floatleft;   
  11.  displayblock;   
  12.  width100px;   
  13. }   
  14. a {   
  15.  font-size9pt;   
  16.  font-weightbold;   
  17.  color#006699;   
  18.  text-decorationnone;   
  19.  line-height12px;   
  20.  width100px;   
  21.  displayblock;   
  22.  vertical-alignmiddle;   
  23. }   
  24. a:hover {   
  25.  line-height12px;   
  26.  color#FF9900;   
  27.  text-decorationnone;   
  28. }   
  29. #enFont{   
  30.  font-size10px;   
  31.  color#999999;   
  32.  width100px;   
  33.  font-familyVerdanaArialHelveticasans-serif;   
  34.  line-height10px;   
  35. float:left;   
  36. }   
  37. span{margin:0px;padding:0px;}   
  38. </style>   
  39. </head>   
  40. <body>   
  41. <ul>   
  42.  <li><a href="/">网站主页</a><span id="enFont">HOME</span></li>   
  43.  <li><a href="/">最新更新</a><span id="enFont">NEW</span></li>   
  44.  <li><a href="/">下载排行</a><span id="enFont">TOP</span></li>   
  45.  <li><a href="/">网站服务</a><span id="enFont">SERVICE</span></li>   
  46.  <li><a href="/">用户留言</a><span id="enFont">GUESTBOOK</span></li>   
  47.  <li><a href="/">联系我们</a><span id="enFont">CONTACT</span></li>   
  48. </ul>   
  49. </body>   
  50. </html>  



相关阅读:
PHP批量生成静态HTML的简单原理和方法
Win10最新预览版怎么还原以前Win7或Win8?
MySQL数学函数简明总结
MySQL页面访问统计及排名情况
JavaScript实现随机替换图片的方法
iOS应用中发送HTTP的get请求以及HTTP异步请求的方法
mysql动态游标学习(mysql存储过程游标)
Win8.1如何关闭动态磁贴让耳朵清静下
win7 64位系统提示"Windows7不能识别网络打印机"的故障原因及解决方法
C#判断某程序是否运行的方法
Win10/Win8.1原生支持FFmpeg:视频格式通吃
jQuery事件绑定on()与弹窗实现代码
C#中事件的继承实例分析
基于HTML+CSS+JS实现增加删除修改tab导航特效代码
快速导航
PHP MySQL HTML CSS JavaScript MSSQL AJAX .NET JSP Linux Mac ASP 服务器 SQL jQuery C# C++ java Android IOS oracle MongoDB SQLite wamp 交通频道 作文范文 我们注定要在一起 王宝强财产分割:马蓉欲分割9成财产 王宝强离婚进展 2016保安公司辞职报告范文 童趣作文1300字 你是我最耀眼的阳光 原来世间还是有很多真爱的 苏州乐园150字 我喜欢的一只狗 —2011学年下学期班主任工作计划 公司开业答谢词 40条超赞的爱情经典语录 我和爸妈看车展300字 社会人生价值名言 我的好友 小学五年级作文550字:看杂技、买年货、乐融融 初中初二作文800字:突如其来的雨 植一点绿 人生,原本就是风尘中的沧海桑田 致我最爱最爱的奶奶 公司年会开场歌曲 赐耆老布帛(一作张复元诗) 难忘妇女节作文700字 夜捉鱼 疗伤的句子 12句 游上海作文350字 我说环保,我看现在作文1100字 顾心亦伴不想和你分手 桂林的山 心疼---疼惜---爱惜---爱情 中考后我要给你一个拥抱作文700字 我的教室作文600字 外出培训研修总结 小时候作文450字 泪痕《三十三》 中秋贺词客户 诗,195首 高中高一作文700字:热度 外贸助理实习周记范文 镇社会主义新农村建设五年规划 我们曾经有过的甜蜜 给我们一点空间吧 父亲在儿子婚礼上致词 作风建设永远在路上观后感1000字 生活中的变化 一(5)班教室作文350字 永远永远不够好的我们 春节给下属的祝福语 小学六年级作文600字:那个冬天的秘密 2015县贸易服务局实施市场拓展举措情况汇报 毛笔小酌

Copyright © 2016 phpStudy |