兼容FF,IE的纯CSS下拉菜单

代码简介:作者的CSS水平不错啊,值得我们学习,少了JS,就是好看多。

代码内容:

<!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><title>兼容FF,IE的纯CSS下拉菜单_网页代码站(www.webdm.cn)</title>
<style type="text/css"> 
*{margin:0;padding:0;} 
.menu{font-size:12px;position:relative;z-index:100;} 
.menu ul{list-style:none;} 
.menu li {float:left;position:relative;} 
.menu ul ul {visibility:hidden;position:absolute;left:3px;top:23px;} 
.menu table {position:absolute; top:0; left:0;} 
.menu ul li:hover ul, 
.menu ul a:hover ul{visibility:visible;} 
.menu a{display:block;border:1px solid #aaa;background:#cacaca;padding:2px 10px;margin:3px;color:#fff;text-decoration:none;} 
.menu a:hover{background:#fafafa;color:#000;border:1px solid #000;} 
.menu ul ul{} 
.menu ul ul li {clear:both;text-align:left;font-size:12px;} 
.menu ul ul li a{display:block;width:100px;height:15px;margin:0;border:0;border-bottom:1px solid #858585;} 
.menu ul ul li a:hover{border:0;background:#fafafa;border-bottom:1px solid #fff;} 
</style> </head>
<body>
<div class="menu"> 
<ul> 
<li><a href="/">XHTML/CSS 
<!--[if IE 7]><!--></a><!--<![endif]--> 
<!--[if lte IE 6]><table><tr><td><![endif]--> 
<ul> 
<li><a href="/">标准</a></li> 
<li><a href="/">教程</a></li> 
<li><a href="/">技术文章</a></li> 
<li><a href="/">常见问题</a></li> 
<li><a href="http://www.webdm.cn/">布局教程专题</a></li> 
<li><a href="/">CSS菜单</a></li> 
<li><a href="/">浏览器兼容</a></li> 
<li><a href="/">滚动条相关</a></li> 
<li><a href="/">圆角矩形专题</a></li> 
<li><a href="/">CSS特效欣赏专题</a></li> 
</ul> 
<!--[if lte IE 6]></td></tr></table></a><![endif]--> 
</li> 
<li><a href="http://www.webdm.cn/">07艺术
<!--[if IE 7]><!--></a><!--<![endif]--> 
<!--[if lte IE 6]><table><tr><td><![endif]--> 
<ul> 
<li><a href="http://www.webdm.cn/">设计家园</a></li> 
<li><a href="/">设计家园</a></li> 
</ul> 
<!--[if lte IE 6]></td></tr></table></a><![endif]--> 
</li> 
<li><a href="/">Javascript 
<!--[if IE 7]><!--></a><!--<![endif]--> 
<!--[if lte IE 6]><table><tr><td><![endif]--> 
<ul> 
<li><a href="/">JSON</a></li> 
<li><a href="/">技术文章</a></li> 
</ul> 
<!--[if lte IE 6]></td></tr></table></a><![endif]--> 
</li> 
<li><a href="/">DOM</a></li> 
<li><a href="/">XML</a></li> 
<li><a href="/">正则表达式 
<!--[if IE 7]><!--></a><!--<![endif]--> 
<!--[if lte IE 6]><table><tr><td><![endif]--> 
<ul> 
<li><a href="/">正则表达式简介</a></li> 
<li><a href="/">正则表达式之道</a></li> 
</ul> 
<!--[if lte IE 6]></td></tr></table></a><![endif]--> 
</li> 
<li><a href="/">网站优化</a></li> 
<li><a href="/">电脑网络</a></li> 
<li><a href="/">建站技术 
<!--[if IE 7]><!--></a><!--<![endif]--> 
<!--[if lte IE 6]><table><tr><td><![endif]--> 
<ul> 
<li><a href="/">HP</a></li> 
<li><a href="/">ASP</a></li> 
<li><a href="/">ASP.NET</a></li> 
<li><a href="http://www.webdm.cn/">JSP</a></li> 
<li><a href="/">SQL</a></li> 
<li><a href="/">Flash</a></li> 
<li><a href="/">Dreamweaver</a></li> 
</ul> 
<!--[if lte IE 6]></td></tr></table></a><![endif]--> 
</li> 
</ul> 
</div> 
</body>
</html>
<br>
<p><a href="http://www.webdm.cn">网页代码站</a> - 最专业的代码下载网站 - 致力为中国站长提供有质量的代码!</p>

代码来自:http://www.webdm.cn/webcode/cefea0cc-ffc0-4bfd-a44b-57eec600e51d.html

转载于:https://www.cnblogs.com/webdm/archive/2011/06/08/2074837.html

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/303528.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

荐书 | 5本数学科普让你不再“畏惧”数学,感受数学的内在美

最近&#xff0c;小木了解了许多关于数学的书籍&#xff0c;简直打开了小木数学新世界的大门。出版社寄了一些样书给小木&#xff0c;经过斟酌对比之后&#xff0c;推荐以下5本数学科普书给大家。01《数学简史》[中] 蔡天新 43.50提到数学&#xff0c;很多人的第一反应就是复杂…

操作系统hpf算法事例_操作系统调度算法是什么

操作系统调度算法是什么导读&#xff1a;小编根据大家的需要整理了一份关于《操作系统调度算法是什么》的内容&#xff0c;具体内容&#xff1a;学习操作系统的朋友们肯定遇到过调度算法&#xff0c;目的是控制资源使用者的数量,选取资源使用者许可占用资源或占用资源&#xff…

ASP.NET Core依赖注入初识与思考

一、前言在上一篇中&#xff0c;我们讲述了什么是控制反转(IoC)以及通过哪些方式实现的。这其中&#xff0c;我们明白了&#xff0c;「控制反转&#xff08;IoC&#xff09;」 是一种软件设计的模式&#xff0c;指导我们设计出更优良&#xff0c;更具有松耦合的程序&#xff0c…

memcached mysql缓存_memcached做数据库缓存

最近研究memcache小有成果&#xff0c;把经验分享出来。白话:很早就听说memcache了&#xff0c;一直没搞懂&#xff0c;后来又看到redis很火&#xff0c;可以用来做缓存&#xff0c;研究了半天也没搞懂咋个做缓存&#xff0c;后来也不纠结了&#xff0c;继续学习python,当对pyt…

掌握Python爬虫基础,仅需1小时!

随着互联网的发展&#xff0c;google、百度等搜索引擎让我们获取信息愈加方便。但需求总会不断涌现&#xff0c;纯粹地借助百度等收集信息是远远不够的&#xff0c;因此编写爬虫爬取信息的重要性就越发凸显。比如有人为了炒股&#xff0c;专门爬取了多种股票信息&#xff1b;也…

我看ITIL在中国(六):如何建立有中国特色的IT运维管理平台【二】

在开始筹划建设有“中国特色的IT运维管理平台”之前&#xff0c;先来看看我们目前面临的情况&#xff1a; 随着信息化建设的不断深入&#xff0c;各种企业的核心业务都逐步地迁移到IT平台上来&#xff0c;对IT管理的要求也越来越高&#xff0c;IT需要管理&#xff0c;向IT管理要…

史上首次!世界杯使用视频裁判

2018年6月16日18时&#xff0c;法国队在喀山中央球场迎来了他们本届世界杯的首场比赛&#xff0c;对手是澳大利亚队。比赛进行到第56分钟&#xff0c;格列兹曼接到队友的直塞球&#xff0c;单刀杀入禁区&#xff0c;澳大利亚后卫里斯登铲球&#xff0c;但并没有碰到皮球&#x…

mysql 5.6.37 winx64_Mysql 5.6.37 winx64安装双版本mysql笔记记录

机器上现在已经存在5.0版本Mysql的情况下&#xff0c;继续安装一个最新版的mysql.一、官网下载免安装压缩包。本人下载的是mysql-5.6.37-winx64.zip.将压缩包解压到自定义目录中。例如:D:\mysql-5.6.37.二、添加环境变量.右键单击我的电脑->属性->高级系统设置(高级)->…

二分查找和折半插入排序一块说说-很合适~~~

前言上一篇在聊时间复杂度和空间复杂度时&#xff0c;没有按指定格式显示(明明预览的时候没问题的)&#xff0c;强迫症的我稍微优化了一下重新发布&#xff0c;目的就是让小伙伴看着舒服。上次聊到的直接插入排序在比较有序数据和待插入数据时&#xff0c;是通过依次遍历的方式…

用Python更加了解微信好友

用了微信几年了&#xff0c;微信号有也不少了&#xff0c;但是真正了解自己的好友吗&#xff1f;好友最多的城市是哪个&#xff1f;好友男女比例是多少&#xff1f;好友签名都是什么&#xff1f;今天我们来充分了解自己的微信好友。运行平台&#xff1a; Windows Python版本&a…

Linux下配置DNS

Linux下配置DNS一、配置环境1.Linux操作系统版本&#xff1a;RedHat AS 52.网络环境设置&#xff1a;IP&#xff1a;192.168.1.1 NetMark&#xff1a;255.255.255.0 Getway&#xff1a;192.168.1.13.软件包的准备&#xff1a;1&#xff09;bind-9.3.3-7.el5.i386.rpm …

python用pandas提取行列_python- pandas 不删除符合条件的行和列

我正在尝试建立一个回归模型,以便根据出现的单词来预测收视率(1-5)(回归本身并不一定表现良好,更多的是关于所采用的方法).我使用以下代码创建了一个词频矩阵&#xff1a;bow df.Review2.str.split().apply(pd.Series.value_counts)看起来像这样&#xff1a;我现在有兴趣删除在…

中国宜坚持发展自主操作系统

一直以来&#xff0c;我国IT产业存在“缺芯少魂”的问题&#xff0c;芯指的是芯片&#xff0c;魂指的是操作系统。操作系统是连接硬件和应用软件的媒介和桥梁。如果无法在操作系统方面实现安全可控&#xff0c;整个信息安全就无从谈起&#xff0c;而恰恰当下国内桌面操作系统市…

老板啥都懂,还天天套路我?!

今天我被老板叫到办公室进行了一场“推心置腹”的对话▼来源&#xff1a;特大号文章版权归原作者所有&#xff0c;转载仅供学习使用&#xff0c;不用于任何商业用途&#xff0c;如有侵权请留言联系删除&#xff0c;感谢合作。

如何提高电脑办公效能

其实你只要花一点点的时间&#xff0c;就可以使你的生活变得更好。在电脑办公上&#xff0c;记忆几个快捷键、安装一些实用的软件等绝对会让你的效率翻倍&#xff01; 在此弥缝分享几条我常常使用到的技巧和软件&#xff1a; 熟练一些快捷键 熟练的快捷键越多&#xff0c;做事越…

BeetleX.Http.Clients访问https服务

最近在做数据分析平台&#xff0c;那在做这个产品的时最需要的自然是测试数据&#xff0c;自己去构建行业测试数据比较麻烦&#xff0c;看到有同行产品的演示数据当然不能错过。由于采集过程中使用到BeetleX.Http.Clients去抓取第三方的Https接口数据&#xff0c;所以顺便记录一…

这一次,用数据解读玩家行为,用实力拿下预测大奖!

如今&#xff0c;大数据落地应用已十分广泛&#xff0c;除了政务、金融、医疗、旅游等传统行业外&#xff0c;在游戏行业中的应用也逐渐受人瞩目。那么&#xff0c;当大数据遇上游戏产业&#xff0c;会产生哪些变革和创新呢&#xff1f;众所周知&#xff0c;全球游戏市场规模庞…

如何在 C# 中使用隐式和显式操作符

C# 有一个鲜为人知的特性是通过定义 显式和隐式操作符 实现类型之间的转换&#xff0c;这篇文章我们将会讨论如何使用这些 显式 和 隐式 操作符。什么是显式&#xff0c;什么是隐式 隐式类型转换 它是运行时自动帮你完成的&#xff0c;言外之意就是你不需要人为干预&#xff0c…

SUSE10下配置FTP服务

SUSE10 liuux下配置FTP和SUSE9有不同之处&#xff0c;大家请注意。下面为SUSE10下ftp服务配置具体步骤。 Linux 系统安装完成后&#xff0c;默认不会开启FTP 服务&#xff0c;需要在yast界面下进行手动启动: 说明&#xff1a;如果未安装FTP 包&#xff0c;则需要先行安装FTP 软…

java gzip 解压文件_Java实现文件压缩与解压[zip格式,gzip格式]

原文&#xff1a;http://www.cnblogs.com/visec479/p/4112881.html#3069573Java实现ZIP的解压与压缩功能基本都是使用了Java的多肽和递归技术&#xff0c;可以对单个文件和任意级联文件夹进行压缩和解压&#xff0c;对于一些初学者来说是个很不错的实例。zip扮演着归档和压缩两…