web前端-ie6下兼容li:hover 使用csshover3.htc没有反应，代码哪里有问题？

问题描述

ie6下兼容li:hover 使用csshover3.htc没有反应，代码哪里有问题？ 
1. 想知道为什么没有反应呢？代码哪里有问题吗？
2. 下面代码中:hover后面跟的div.pop这个选择器怎么用？
    .top ul.left li.follow:hover div.pop {
           display: block;
    }

  <!DOCTYPE HTML>
<html lang="zh-CN">

<head>
    <meta charset="UTF-8">
    <title>demo</title>
    <meta name="Keywords" content="" />
    <meta name="Description" content="" />
    <!--[if lt IE 9]>
    <script src="js/html5shiv.js"></script>
    <![endif]-->
    <style>
        body,
        ul,
        p {
            margin: 0;
            padding: 0;
        }
        body {
            font-size: 12px;
            behavior: url("http://git.oschina.net/bianweiall/jquery/raw/master/html/jd/css/csshover.htc");
        }
        ul {
            list-style: none;
        }
        a {
            text-decoration: none;
        }
        .container {
            width: 960px;
            margin: 0 auto;
            padding: 0px 10px;
        }
        .clearfloat {
            clear: both;
            height: 0;
            font-size: 1px;
            line-height: 0px;
        }
        /*header start*/
        .top {
            background-color: #F7F7F7;
            border-bottom: 1px solid #EEEEEE;
        }
        .top ul li {
            height: 30px;
            line-height: 30px;
        }
        .top ul li a {
            color: #666;
        }
        .top ul li a:hover {
            color: #E4393C;
            text-decoration: underline;
        }
        /*ul.left start*/
        .top ul.left {
            float: left;
        }
        .top ul.left li {
            height: 30px;
            line-height: 30px;
            margin-right: 18px;
            float: left;
            color: #666;
        }
        .top ul.left li span {
            margin-right: 5px;
            display: block;
            background-repeat: no-repeat;
            float: left;
        }
        .top ul.left li.follow {
            position: relative;
        }
        .top ul.left li.follow div {
            display: none;
            position: absolute;
            width: 116px;
            height: 129px;
            top: 36px;
            left: -50px;
            background-color: #fff;
            border: 1px solid #ddd;
            z-index: 10;
        }
        .top ul.left li.follow div span {
            position: absolute;
            width: 0;
            height: 0;
            left: 48px;
            border-width: 10px;
            border-style: solid;
            _overflow: hidden;
            _border-style: dotted dashed solid dashed;
        }
        .top ul.left li.follow span.arrow1 {
            top: -20px;
            border-color: transparent transparent #ddd transparent;
        }
        .top ul.left li.follow span.arrow2 {
            top: -19px;
            border-color: transparent transparent #fff transparent;
        }
        .top ul.left li.address strong {
            margin-right: 2px;
        }
        .top ul.left li.follow:hover div.pop {
            display: block;
        }
        /*ul.left end*/
    </style>
</head>

<body>
    <div class="header">
        <div class="top">
            <div class="container">
                <ul class="left">
                    <li class="favorites">
                        <a href="#">收藏</a>
                    </li>
                    <li class="follow">
                        <a href="#">关注</a>
                        <div class="pop">
                            <span class="arrow1"></span>
                            <span class="arrow2"></span>
                        </div>
                    </li>
                    <li class="address">
                        <strong>北京</strong><a href="#">[更换]</a>
                    </li>
                </ul>
                <div class="clearfloat"></div>
            </div>
        </div>
    </div>
</body>

</html>

解决方案

因为跨域的问题吧。没这么用过。

解决方案二：

自己写个div测试一下。 层级嵌套。

时间： 2024-07-29 02:07:56

web前端-ie6下兼容li:hover 使用csshover3.htc没有反应，代码哪里有问题？的相关文章

web前端-标签&amp;amp;lt;li&amp;amp;gt;中怎么插入背景图片，不能跟标签&amp;amp;lt;dd&amp;amp;gt;同样的用background吗？

问题描述 标签<li>中怎么插入背景图片,不能跟标签<dd>同样的用background吗? 鄙人前端初学者,在ul标签下面的li中插入背景图片问题上郁闷了两天,跟视频老师用同样的代码(background:url方法)仍然实现不了,但是在dl下面的dd中用background:url的方法就可以完成,请大师们帮我解决这个烦恼,最好代码举例哦,万分感谢! 解决方案 <!DOCTYPE html> s1 s2 解决方案二: 我觉得你最好把代码贴上来,这样别人看你代码才知道

《Web前端开发最佳实践》——第3章 标准的HTML代码3.1　验证代码是否符合标准

第3章 标准的HTML代码 标准的HTML代码指的是HTML代码符合W3C的最新标准,而在页面的HTML代码中包含有任何规范之外的或者是不推荐的标签和属性都是不符合标准的.W3C定义了所有规范的HTML标签及其属性,目前正式的版本是HTML5,HTML5中定义的大部分内容已经被所有的高级浏览器支持,所以并不妨碍在页面中使用这些已经广泛被支持的新标签和新属性.本章将贴近W3C标准,介绍如何构建标准的页面HTML代码. 3.1 验证代码是否符合标准 一个符合W3C标准的网页会有什么重要的意义呢?这是

走近Web前端工程师 看前端工程师的价值

这是一个很老的话题"前端工程师的价值体现在哪里?". 有人说:"前端工程师之于网站的价值犹如化妆师之于明星的价值."一位好的 Web 前端开发工程师在知识体系上既要有广度,又要有深度.当然,Web 前端工程师并不是设计师,每天接触最多的是代码,代码,还是代码.对此,你是如何给自己定位的?你的价值是否能够得到很好的体现?如今,旧话重提无非是想 与开发者们共同探讨下前端工程师的价值所在,希望对你有所感悟. 前端工程师的价值体现在哪里? 一起来看下业内资深大牛对前端工程师

web前端-前辈，请问下面的代码怎么解释？

问题描述 前辈,请问下面的代码怎么解释? 前辈 请问下面的代码怎么解释? 原地址http://www.w3school.com.cn/tiy/t.asp?f=jquery_parent <!DOCTYPE html> <html> <head> <style> .ancestors * { display: block; border: 2px solid lightgrey; color: lightgrey; padding: 5px; margin:

png在IE6 下无法透明的解决方法汇总_javascript技巧

FF和IE7已经直接支持透明的png图了,下面这个主要是解决IE6下透明PNG图片有灰底的 复制代码 代码如下: style="FILTER: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=images/fl.png')" 语法: filter : progid:DXImageTransform.Microsoft.AlphaImageLoader ( enabled=bEnabled , sizingMethod=sSi

!important在ie6下的一个BUG和CSS的优先级。

在没有DTD的声明的情况下,在同一个选择器样式(即同一个大括号里面)下,IE6,IE7,IE8对!important的解析都是无效的. 一 css的优先级 今天有人跟我说css hack中用!important来区分ie6,因为ie6不支持!important,是的在很早以前我也是用过这种方法写hack,但是后来就基本不用了.本来我对他谁的ie6不支持!important也没什么异议,可是正好在前几天正好用个这个!important属性解决了一个样式优先级的问题,而且是支持ie6的,这是为什么呢

ie6下背景图片不缓存解决办法

一,利用了execCommand来操作,很方方便代码如下.  代码如下 复制代码 if($.browser.msie && $.browser.version == "6.0"){     try{         document.execCommand('BackgroundImageCache', false, true);     }catch(e){} }; //execCommand .net一个对当前文档,当前选择或者给出范围的命令 二,IE6下默认不缓存

IE6下float出错误解决办法

margin 和 padding 只是一个间接原因,如果没有内外边距,可能外层 div 刚好可以容纳内部的 float. 加上边距后,每个 float 占用的空间就变大了,首先带来的问题是 div 的宽度不够,那么,愚蠢的 IE6 就会产生莫名其妙的问题,反映给用户的现象就是出现鬼影. 解决方案一: 准确计算内部 float 元素加在一起占用的宽高,确保外层 div 在 css 中明确指定了具体的 width 和 height 像素值,问题不会再出现. 其它解决方案 给浮动的div加上两个语句 

IE6下是否能正常显示你的站点 如何解决兼容问题

中介交易 SEO诊断 淘宝客 云主机 技术大厅 关于站点模板在ie浏览器中的兼容情况,兰州网站建设在之前的影响网站用户体验的因素中提及过,这几天在回访一些友链.同行站点时还是发现一些同样的问题,包括wordpress和emblog的一些主题模板也是,即站点在ie7.8中显示正常,但在ie6中确是有javascript脚本错误和css跑样的问题,我觉得有必要单独提出来说说. 目前国内的95%以上的上网用户使用的都是xp 的系统,而xp默认的是却是ie6的浏览器.对前端开发人员来讲,ie6是最熟悉不