:hover是我们在CSS设计中最常运用的伪类之一,许多绚丽效果的实现离不开伪类:hover,比如我们常见的纯CSS菜单、相册效果等等。

或许用了这么久的伪类:hover,还有部分朋友还不完全了解hover的规则:

引用:
在CSS1中此伪类仅可用于a对象。且对于无href属性(特性)的a对象,此伪类不发生作用。
在CSS2中此伪类可以应用于任何对象。

但目前IE5.5、IE6仅支持CSS1中的:hover,不过新出的IE7是支持CSS2中的:hover。

当我们用伪类:hover做某些特殊效果时,依据CSS2很好完成,但为了现在占据主流浏览器的IE6,我们又不得不做很多工作,比如给添加a元素等来模拟完成最终的效果。

IE bug:当<a>中元素采用position的时候,需要加一个背景来表明<a>的控制范围,否则鼠标滑过没有任何效果。
 
<!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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="author" content="www.xincss.com" />
<style type="text/css">
a.moreshow {
position:relative;
}
a.moreshow:hover {/*IE中的BUG,需要添加属性改变BUG,例如background*/
background:#fff;
}
a.moreshow span {
display:none;
}
a.moreshow:hover span {
position:absolute;
display:block;
width:140px;
border:1px solid #1e6c09;
background:#eef5ee;
}
</style>
<title>xincss.com</title>
</head>
<body>
IE bug:当&lt;a&gt;中元素采用position的时候,需要加一个背景来表明&lt;a&gt;的控制范围,否则鼠标滑过没有任何效果。<br />
<a href="#" title="" class="moreshow">【详细】<span>BKK 曼谷:--<br />
LCH 林查班:--<br />
HCM 胡志明:--<br />
HK 香港:--</span></a>
</body>
</html>

a:hover span 隐藏/显示 问题的更多相关文章

  1. 解决JQuery中datatables设置隐藏显示列多次提交后台刷新数据的问题

    此次项目开发过程中用到了Jquery的Datatables插件,无疑他是数据列表展示,解决MVC中同步过程中先走控制器后返回视图,查询数据过程中无法提示等待的弊端, 而且他所提供的各种方法也都有较强的 ...

  2. js(jquery)鼠标移入移出事件时,出现闪烁、隐藏显示隐藏显示不停切换的情况

    <script> $(".guanzhu").hover(function(){ $(".weixinTop").show(); },functio ...

  3. Jquery_效果-隐藏显示、淡入淡出、滑动面板、简单的动画队列

    1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="U ...

  4. JQuery中隐藏/显示事件函数

    1.$("button").click(function(){ $("p").hide(); });2.如果您的网站包含许多页面,并且您希望您的 jQuery ...

  5. [转]javascript 快速隐藏/显示万行表格列的方法

    原文地址:javascript 快速隐藏/显示万行表格列的方法 隐藏表格列,最常见的是如下方式: td.style.display = "none"; 这种方式的效率极低.例如,隐 ...

  6. JS控制DIV隐藏显示

    转载自:http://blog.sina.com.cn/s/blog_6c3a67be0100ldbe.html JS控制DIV隐藏显示 一,需求描述: 现在有3个DIV块,3个超链接,需要点击一个链 ...

  7. 微信分享功能引入页面-控制分享时候调用的标题、图片、url和微信按钮隐藏显示控制

    1.设置分享调用的标题.图片.url预览. 2.控制右上角三个点按钮的隐藏显示(和底部工具栏的显示隐藏--未测试). 3.判断网页是否在微信中被调用. <!doctype html> &l ...

  8. C#使用Windows API 隐藏/显示 任务栏 (FindWindowEx, ShowWindow)

    原文 C#使用Windows API 隐藏/显示 任务栏 (FindWindowEx, ShowWindow) 今天,有网友询问,如何显示和隐藏任务栏? 我这里,发布一下使用Windows API 显 ...

  9. 基于特定值来推断隐藏显示元素的jQuery插件

    jQuery-Visibly是一款小巧简单的jQuery隐藏显示元素插件.该插件依据某个元素的值,例如以下拉框的值.输入框的值等来推断是否显示某个指定的元素. 用于推断的值能够是单个值,或者是多个值, ...

随机推荐

  1. 15. SSH 远程

    一.原理:     使用SSH连接Centos时,我们可以创建一个公钥和一个私钥,公钥放在服务端,私钥放在客户端,当客户端去连接服务端时,会先去查找密钥,     要是客户端的私钥可以和服务端的公钥匹 ...

  2. 基于avalon1.4.x ----分页组件编写

    avalon分页组件 (1.4.x版本) 随着avalon2的推出,avalon1的官网已经不再维护了,现在似乎是找不到avalon 1.4版本的官方文档了,所以本文章所有的内容均不保证正确性,只能保 ...

  3. (转) 学习C++ -> 类(Classes)的定义与实现

    学习C++ -> 类(Classes)的定义与实现 一."类" 的介绍    在C++中, 用 "类" 来描述 "对象", 所谓的&q ...

  4. MySQL 初学笔记 ① -- MySQL用户登录权限控制

    1. MySQL 登录 MySQL -u username -p 2. MySQL 创建用户 use mysql //进入mysql 表 INSERT INTO user (Host,User,Pas ...

  5. linux cat命令的<<EOF

    初初开始学习linux的命令,只对linux一些简单命令有一些了解! 首先我看到网上有一些创建一个文件采用的命令是(mkdir创建文件夹):cat > test1.txt <<EOF ...

  6. 异常处理与调试4 - 零基础入门学习Delphi53

    调试(Debug) 让编程改变世界 Change the world by program 调试(Debug) 在应用程序开发中检测.处理程序中的错误是一个非常重要的环节.在Delphi的集成开发环境 ...

  7. c++基础五个题(二)

    一.c++中static的作用 1.隐藏:当同时编译多个文件时,所有未加static前缀的全局变量和函数都具有全局可见性,static函数作用就是为了隐藏 2.可以保持变量的持久:存储在静态数据区的变 ...

  8. C# 集合详解 (适合新手)

    System.Collections 命名空间包含接口和类,这些接口和类定义各种对象(如列表.队列.位数组.哈希表和字典)的集合.System.Collections.Generic 命名空间包含定义 ...

  9. SWFUpload批量上传插件

    SWFUpload是一个批量上传插件,在HTML4.1里面,估计也只有Flash+javascript配合才能够做到了.先复制个重要的网址,这个应该是官方的文档了,相当齐全. http://leeon ...

  10. WPF笔记(1.2 Navigation导航)——Hello,WPF!

    原文:WPF笔记(1.2 Navigation导航)--Hello,WPF! 这一节是讲导航的.看了一遍,发现多不能实现,因为版本更新了,所以很多旧的语法不支持了,比如说,不再有NavigationA ...