zoukankan      html  css  js  c++  java
  • 支持多种浏览器的纯css下拉菜单

    <!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;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>

  • 相关阅读:
    SQLMAP注入教程-11种常见SQLMAP使用方法详解
    VS2012/2013/2015/Visual Studio 2017 关闭单击文件进行预览的功能
    解决 IIS 反向代理ARR URLREWRITE 设置后,不能跨域跳转 return Redirect 问题
    Spring Data JPA one to one 共享主键关联
    JHipster 问题集中
    Spring Data JPA 定义超类
    Spring Data JPA查询关联数据
    maven命名
    maven仓库
    Jackson读取列表
  • 原文地址:https://www.cnblogs.com/skyay/p/3826164.html
Copyright © 2011-2022 走看看