CSS控制文字的显示与隐藏引出的BUG

css|控制|显示

  这一段CSS代码相当简单,目的就是想用CSS来控制某段文字的显示与隐藏。起初我采用了下面的代码,令人不可思议的是,它们在我的IE6.0上居然没有任何反应,大家不信可以亲自试验一下。

<style type="text/css">
a {font-size:12px;
text-decoration:none;
height:50;}
a:hover {text-decoration:none;}
a span {font-size:12px;
display:none;}
a:hover span {display:block;}
</style>
<a href="#">link<span>我是隐藏内容</span></a> 

  我仔仔细细地检查了一遍代码,实在找不到什么毛病来。没有办法,我只能像平时查错纠错一样,试着改改CSS里的代码。当我改变了hover伪类链接中的代码时(代码如下所示),突然发现代码可以运行了。

  为了确认CSS是否真存在该bug,我又特地改用大小、颜色、位置等样式来试验,在不改变hover伪类链接的前提下,都无法得到正常情况下应得到的效果。从而可以得知:在包含选择符有伪类链接时,存在着CSS样式无效的bug,希望CSS下一版中能修正这个错误。

a:hover {text-decoration:none;border:none;}

  这样我们可以知道,在hover伪类链接中必须包含某些特殊的CSS属性声明才能消除这个bug。 我用了CSS里所有的属性声明来尝试解决这个bug,发现只有一下几项属性声明能解决这个问题。

    border
    display
    postion
    overfilow
    background

  而我之所以采用“border:none”这种方法,是因为它还能从Netscape 4中消除一些不同的CSS错误。

  注:本文所提及的bug在IE5.5、IE6.0中均存在。

时间: 2024-08-03 15:06:53

CSS控制文字的显示与隐藏引出的BUG的相关文章

CSS控制文字溢出时的自动隐藏方法

 代码如下 复制代码 <!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=&qu

javascript实现控制文字大中小显示

  javascript实现控制文字大中小显示           网页上可以自由改变字体大小是个非常有助于用户体验的小功能,现在许多网站上都有此功能,今天我们来简单实现下. 部分网站内容页通常会看到有控制文字分别以 大,中,小 三种方式显示,下面就把这个小功能做一下记录,对提高网站用户体验度还是有一些帮助的哦! ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 <html> <head> <meta http-equiv=&

js控制文字大中小显示代码

js控制文字大中小显示  代码如下 复制代码 <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>js控制文字大中小显示</title> </head> <body> <script language="javascript"&g

javascript实现控制文字大中小显示_javascript技巧

部分网站内容页通常会看到有控制文字分别以 大,中,小 三种方式显示,下面就把这个小功能做一下记录,对提高网站用户体验度还是有一些帮助的哦! <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>js控制文字大中小显示</title> </head> <body&g

Jquery设置attr的disabled属性控制某行显示或者隐藏_jquery

设置attr的disabled属性可以控制某行显示或者隐藏 //加载费用项目下拉框 function loadChargeItemsSelect(status){ $("#settlementDetailInfo").find("tr[trflag=trflag]").each( function(){ $(this).children().eq(2).html($("#chargeItemsDiv").html()); var eachChar

javascript在一个function里控制loading的显示与隐藏

问题描述 代码如下,不知为何无法执行出loading显示后又隐藏的效果.<html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>javascript在一个function里控制loading的显示与隐藏</title><script type="text/javascrip

CSS控制文字在Div最底部显示

  以下技巧相信是比较实用的,让一行文字始终显示在某个Div的最底部,做前端开发,肯定什么情况都要碰到,虽然这个不常用,不过也是会用到的.用到position:relative.position:absolute;属性.text-align:center;这行是定义显示在最底行的文字水平居中,可以不设置,但文字会靠左显示. 本代码适用Div高度固定,也就是定义了高度的情况下,其实不定义高度的时候,它也是显示在最底部,因为没有高度的情况下,Div会自动适应容器内的内容.

控制软键盘显示和隐藏

 如何用Java代码控制Android软键盘的显示和隐藏呢? 过去我们在 EditText中显示隐藏Android输入法窗口 提到过,部分网友可能没有太注意.InputMethodManager imm = (InputMethodManager)getSystemService(Context.INPUT_METHOD_SERVICE);imm.hideSoftInputFromWindow(myEdit.getWindowToken(), 0); //myEdit是你的EditText对象

控制-JS如何显示和隐藏一个表格中的所有表单输入框。

问题描述 JS如何显示和隐藏一个表格中的所有表单输入框. 现在是想要把表格的补货一栏去掉,在表格底部加一个按钮,点击以后 已补货的数字变成输入框.然后再次点击以后提交. 我想要的是一个按钮,控制所有"已补货"列,所有数字都变成输入框. 控制表格里面加了class是content的数据, 点击以后 <span class=content>0</span> 变输入框,其他列数据不要变. <tr> <td> </td> <td