<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<meta name="keywords" content="站长,网页特效,js特效,广告代码,zzjs,zzjs.net,sky,www.zzjs.net,站长特效 网" />
<meta name="description" content="www.zzjs.net,站长特效网，站长必备js特效及广告代码。大量高质量js特效，提供高质量广告代码下载,尽在站长特效网" />
<title>支持多种浏览器的纯CSS下拉菜单，sky整理收集。</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:red;padding:2px 10px;margin:3px;color:#fff;text-decoration:none;}
.menu a:hover{background:#f2cdb0;color:#f00;border:1px solid red;}
.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:13px;margin:0;border:0;border-bottom:1px solid red;}
.menu ul ul li a:hover{border:0;background:#f2cdb0;border-bottom:1px solid #fff;}
</style>
</head>
<body>
<a href="<#ZC_BLOG_HOST#>">站长特效网</a>,站长必备的高质量网页特效和广告代码。zzjs.net，站长js特效。<hr>
<!--欢迎来到站长特效网，我们网站收集大量高质量js特效，提供许多广告代码下载，网址：www.zzjs.net，zzjs@msn.com,用.net打造靓站-->
<div class="menu">
<ul>
<li><a href="http://zzjs.net/">XHTML/CSS
<!--[if IE 7]><!--></a><!--<![endif]-->
<!--[if lte IE 6]><table><tr><td><![endif]-->
<ul>
<li><a href="http://zzjs.net/">标准</a></li>
<li><a href="http://zzjs.net/">教程</a></li>
<li><a href="http://zzjs.net/">技术文章</a></li>
<li><a href="http://zzjs.net/">常见问题</a></li>
<li><a href="http://zzjs.net/">布局教程专题</a></li>
<li><a href="http://zzjs.net/">CSS菜单</a></li>
<li><a href="http://zzjs.net/">浏览器兼容</a></li>
<li><a href="http://zzjs.net/">滚动条相关</a></li>
<li><a href="http://zzjs.net/">圆角矩形专题</a></li>
<li><a href="http://zzjs.net/">CSS特效欣赏专题</a></li>
</ul>
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
<li><a href="http://zzjs.net/">站长特效网
<!--[if IE 7]><!--></a><!--<![endif]-->
<!--[if lte IE 6]><table><tr><td><![endif]-->
<ul>
<li><a href="http://zzjs.net/">网站首页</a></li>
<li><a href="http://zzjs.net/?cat=1">zzjs</a></li>
<li><a href="http://zzjs.net/?cat=2">网页特效</a></li>
<li><a href="http://zzjs.net/?cat=3">广告代码</a></li>
<li><a href="http://zzjs.net/">rss订阅</a></li>
</ul>
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
<li><a href="http://zzjs.net/">javascript
<!--[if IE 7]><!--></a><!--<![endif]-->
<!--[if lte IE 6]><table><tr><td><![endif]-->
<ul>
<li><a href="http://zzjs.net/?cat=1">JSON</a></li>
<li><a href="http://zzjs.net/?cat=2">技术文章</a></li>
</ul>
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
<li><a href="http://zzjs.net/">DOM</a></li>
<li><a href="http://zzjs.net/">XML</a></li>
<li><a href="http://zzjs.net/">正则表达式
<!--[if IE 7]><!--></a><!--<![endif]-->
<!--[if lte IE 6]><table><tr><td><![endif]-->
<ul>
<li><a href="http://zzjs.net/">正则表达式简介</a></li>
<li><a href="http://zzjs.net/">正则表达式之道</a></li>
</ul>
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
<li><a href="http://zzjs.net/">网站优化</a></li>
<li><a href="http://zzjs.net/">电脑网络</a></li>
<li><a href="http://zzjs.net/">建站技术
<!--[if IE 7]><!--></a><!--<![endif]-->
<!--[if lte IE 6]><table><tr><td><![endif]-->
<ul>
<li><a href="http://zzjs.net/?cat=2">PHP</a></li>
<li><a href="http://zzjs.net/">ASP</a></li>
<li><a href="http://zzjs.net/?cat=2">ASP.NET</a></li>
<li><a href="http://zzjs.net/?cat=2">JSP</a></li>
<li><a href="http://zzjs.net/?cat=2">SQL</a></li>
<li><a href="http://zzjs.net/?cat=3">Flash</a></li>
<li><a href="http://zzjs.net/?cat=1">Dreamweaver</a></li>
</ul>
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
</ul>
</div>
</body>
</html>

支持多种浏览器的纯css下拉菜单的更多相关文章

  1. CSS+JS下拉菜单和纯CSS下拉菜单

    下拉菜单 (思路:先把二级定位到屏幕外,鼠标悬停重新定位回来:另一个就是ul浮动,li也浮动) 下拉菜单的一般思路就是把子导航嵌套在无序列表中,把列表定位到屏幕之外,当鼠标悬停在其父列表项上时,重新定 ...

  2. 纯css下拉菜单的制作

    通过观察下拉菜单的过程,发现有两种状态,一种是鼠标没有hover时,一种是鼠标hover时. 主菜单hover时,显示子菜单:主菜单没有hover时,不显示子菜单 <!DOCTYPE html& ...

  3. 纯CSS下拉菜单（希望对有需要的小伙伴有所帮助）

    效果截图(颜色有点丑,请无视): <!DOCTYPE html> <html> <head> <meta charset="utf-8" ...

  4. 超简洁的CSS下拉菜单

    效果体验:http://hovertree.com/texiao/css/3.htm HTML文件代码: <!DOCTYPE html> <html xmlns="http ...

  5. 华丽导航CSS下拉菜单特效

    华丽导航CSS下拉菜单特效,华丽导航,导航特效,CSS,下拉菜单,华丽特效. 代码地址:http://www.huiyi8.com/sc/26811.html 风景图片网:http://www.hui ...

  6. CSS：CSS 下拉菜单

    ylbtech-CSS:CSS 下拉菜单 1.返回顶部 1. CSS 下拉菜单 使用 CSS 创建一个鼠标移动上去后显示下拉菜单的效果. 下拉菜单实例 实例演示 1 实例演示 2 基本下拉菜单 当鼠标 ...

  7. 使用checkbox实现纯CSS下拉框

    在这个例子中,我们会看到一个纯CSS制作的下拉框.主要是要用到了HTML元素的checkbox 和CSS3选择器,并没有用到JavaScript.例子如下: Click to Expand Link ...

  8. 纯CSS下拉导航菜单

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "<a href="h ...

  9. 简易的CSS下拉菜单 - 1

    <!DOCTYPE html> <html> <head> <style> body{ margin:0; } .dropmenu{ backgroun ...

随机推荐

  1. [RM HA 1] Cloudera CDH5 RM HA功能验证

    简介: 最新的Cloudera CDH5.0.0 beta版本已经支持RM的HA, 笔者为此简单验证了RM HA的功能. 后续将继续分析其HA的原理,以及其与社区RM HA的区别. 集群部属与RM f ...

  2. STL中set底层实现方式

    Q:STL中set底层实现方式? 为什么不用hash? A: 第一个问题:set底层实现方式为RB树(即红黑树). 第二个问题: 首先set,不像map那样是key-value对,它的key与valu ...

  3. WPA/WAP2wifi 密码破解笔记

    前言: 相对于前一段时间脆弱的WEP路由器而言,当今的路由器加密方式也大都改变为WPA/WPA2,使得无线路由器的破解难度增加.虽然如此,但还是有很多漏洞层出不穷,如WPS.退一步来说,即使加密算法无 ...

  4. Android核心分析 之十Android GWES之基本原理篇

    Android GWES基本框架篇 我这里的GWES这个术语实际上从Microsoft 的Window上移植过来的,用GWES来表示Android的窗口事件系统不是那么准确,在Android中Wind ...

  5. SPRING IN ACTION 第4版笔记-第十章Hitting the database with spring and jdbc-002-本章的源代码

    0.结构 一.JDBC层 1. package spittr.db; import java.util.List; import spittr.domain.Spitter; /** * Reposi ...

  6. JVM垃圾回收机制总结(7) ：调优方法

    JVM调优工具 Jconsole,jProfile,VisualVM Jconsole : jdk自带,功能简单,但是可以在系统有一定负荷的情况下使用.对垃圾回收算法有很详细的跟踪.详细说明参考这里 ...

  7. C++：异常的处理

    6.4 异常处理 程序中常见的错误分为两大类:编译时期的错误和运行时期的错误. 编译时期的错误比较简单容易发现:主要是语法错误,如关键字拼写错误.缺分号.括号不匹配等 运行时期的错误比较难发现,甚至是 ...

  8. .NET在EF中使用sql，用动态类吧！

    .NET在EF中使用sql,用动态类吧! 前言 在.NET中使用Entity Framework能快速.方便地结合LINQ来对数据库进行一系列的增删改查操作.但是由于EF根据表达式最后生成通用的sql ...

  9. Windows7配置GPU和Theano编程环境

    可参考Windows安装Theano官方教程: http://deeplearning.net/software/theano/install_windows.html#install-windows ...

  10. SQL高性能查询优化语句

    1.应尽量避免在 where 子句中对字段进行 null 值判断,否则将导致引擎放弃使用索引而进行全表扫描,如: select id from t where num is null可以在num上设置 ...