msgbartop
PHP语言, PHP扩展, Zend引擎相关的研究,技术,新闻分享 – 左手代码 右手诗
msgbarbottom

14 Sep 09 CSS让你的IE浏览器崩溃(Crash your IE)

严格来说不单是CSS就能令IE浏览器崩溃(crash),而要配合相应的XHTML架构。到现时为止发现有两种正常写法及一种错误结构分别导致会IE6、IE7崩溃(crash),至于原因我尝试寻找过答案但至今还没找到…如你有这方面的认识或更详细的资料很希望你能分享!

1 crash IE6 code

Demo:http://blog.gulu77.com/demo/200808/crash_ie6.html

此BUG只存在IE6中,当伪类为 a:active 时同样会遇到此问题

a{position:relative;}
a:hover{float:left;}

解决方案:为 <a> 添加 zoom:1; 令其触发haslayout

a{position:relative;zoom:1;}
a:hover{float:left;}

2 crash IE6 code

这是HTML结构错误而导致IE6的崩溃,在<col width=”100″/>前或后添加任何字符均会导致IE6 Crash

Demo:http://blog.gulu77.com/demo/200808/HTML_errors_crash_ie6.html

<table style="table-layout:fixed;">
<colgroup>
<col width="100"/>Crash IE6
</colgroup>
</table>

3 crash IE7 code

Demo:http://blog.gulu77.com/demo/200808/crash_ie7.html

Bug from 偷米饭,此bug只存在IE7中据估计是处理省略字的时候导致IE7崩溃.

<style type="text/css">
div{float:left;width:175px;}
ul{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;}
li{position:relative;}
</style>

<div>
<ul>
<li>崩溃崩溃崩溃崩溃崩溃crash ie7</li>
<li>崩溃崩溃崩溃崩溃崩溃crash ie7</li>
</ul>
</div>

解决方案:

  • 添加 zoom:1; 令其触发haslayout

    <style type="text/css">
    div{float:left;width:175px;}
    ul{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;}
    li{position:relative;zoom:1;}
    </style>

    4 crash IE6 code

    Demo:http://blog.gulu77.com/demo/200808/crash_ie6_test1.html

    当再次改变定位时浏览器崩溃,但似乎也需要N个帮凶才会导致崩溃的代码中CSS table的相属性都缺一不可。

    <!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" />
      	<title>CRASH-IE,CSS让你的IE浏览器崩溃</title>
    	<style type="text/css">
      	html, body {overflow: hidden;scrollbar-base-color: #330066;}
      	.crash {position:absolute;left:200px;top:200px;width:200px;}
    	</style>
    	<script type="text/javascript">
      	function galgenfrist() {
      	window.setTimeout('crashIE();',1000);
      	}
    
     function crashIE() {
      	var moveNode = document.getElementById("move");
      	if(moveNode) {
      	moveNode.style.top = "100px";
      	moveNode.style.left = "200px";
      	}
      	}
    	</script>
    	</head>
    
    <body onload="galgenfrist();">
    	<h1>CRASH-IE</h1>
    	<div id="move" class="crash">
    	<table>
    	<tbody>
    	<tr>
    	<td>
    	<textarea></textarea>
    	</td>
    	</tr>
    	</tbody>
    	</table>
    	</div>
    	</body>
    </html>
    

    5 crash IE6 code

    Demo:http://blog.gulu77.com/demo/200808/crash_ie6_test2.html

    具体引起的原因暂时无法解析,但在兼容性和执行效率来看一般不会采取这样的写法。

    <script>
    	for (x in document.write) {
    		document.write(x);}
    </script>
    

    6 crash IE6 code

    Demo:http://blog.gulu77.com/demo/200808/crash_ie6_test3.html

    传说是一名日本人发现的,table中直接放置内容,在IE6会引起Mshtml.all模块损坏而关闭浏览器,非IE6则安全无恙。

    <style>
    	* {position:relative}
    </style>
    <table>
    	<input>
    </table>
    

    7 crash IE6 code

    Demo:http://blog.gulu77.com/demo/200808/crash_ie6_test4.html

    <body onLoad=”window()”>
    

    8 crash IE6 code

    Demo:http://blog.gulu77.com/demo/200808/crash_ie6_test5.html

    CSS中出现@+任意字符+/* 立即崩溃。

    <style>
    	@;/*
    </style>
    

    原文地址:http://blog.gulu77.com/?p=59





    Random Posts:

  • 13 Responses to “CSS让你的IE浏览器崩溃(Crash your IE)”

    1. Jam |

      这里有个通知IE6 IE7 IE8的Crash代码:
      http://www.iteye.com/topic/1112416

    2. 朱宝祥 |

      真实神奇的bug。学习了,标记一下,以后学耍酷来这里。哈

    3. hiheng |

      真是万能的zoom:1,哈哈。

    4. 技术门户网站 |

      windows7内置的是IE8

    5. SAUNDERSSANDY |

      When you are in not good state and have no money to go out from that, you would require to take the personal loans. Just because that should aid you unquestionably. I take bank loan every single year and feel myself fine because of this.

    6. samuel |

      全都是IE的,还是FIREFOX好啊

    7. berger |

      以前也遇到过一次css crash,让人郁闷了快一天,当时遇到的问题是,编码写的太不规范,自觉着,要是规范点使用标签,会好点

    8. fybird |

      赞!

    9. toms |

      大侠能不能说下这个是怎么回事阿

      class base
      {
      public function run($module, $params)
      {
      $this->{$module}($params);
      }
      }

      class sub extends base
      {
      public functin show()
      {
      $this->run(‘module_news’, $params);
      }

      public function module_news($params)
      {
      }
      }

      我看见joomla里的代码有这样的写法, 但joomla是php4的写法, 为什么module_news为public的时候才能被调用呢?

    10. jindw |

      不错,呵呵。

    11. 雪候鸟 |

      sql文件在包里有.pscms_admin/tables.sql

    12. 5455 |

      您好:
      PHP Pallas CMS的数据库 我找不到在哪里? 想学习学习php。可以发数据库给我吗?
      谢谢

    13. Edward |

      IE7以前的浏览器是有好多的问题~而且IE有自己的一套标准,根本不去理会什么W3C。

      但是IE8好多了哦~

      但是悲剧的是,还有绝大部分的用户在使用IE6.应为windows内置的就是IE6.而且大家除了浏览网页以外,基本上没所有什么其他的需求。所以,很少有人去更换自己的浏览器,对web开发来说,这个也算是让人小小头痛的事情吧!

    Leave a Reply

    *