Internet Explorer 7中的层叠样式表兼容性不知道怎么的就在MSDN上看见了这篇文章,都2007年了,我还是每天在网上闲逛。
在IE 7下,我的页面乱了、内容溢出了,文字重叠了...这些可能是用了IE 7以后,比较多出现的页面问题吧。不知道我的页面在IE 7下是怎么样的,应该不会有溢出的问题把。(希望)顺便推荐一个网站,可以给你返回各种浏览器浏览你网站的效果图片。(Test your web design in different browsers)
继续话题,文章上提到了几点引起这些浏览的问题关键:
处理overflow:visible的默认行为
设置了默认的高度和宽度,在IE 6的年代,内容如果超出范围,高度将会自适应的变化(好似很智能),但是在IE 7下就会有溢出了,如果你必须要制定一个最小的高度或者宽度的话,推荐使用min-height和min-width由于CSS hacks的改进而导致的错误页面(IE 7对于CSS支持的改进)
一些老的CSS hacks写法,比如用html > body,head + body,head:first-child + body等来区别IE和其他现代浏览器,因为IE 7已经支持以上CSS声明,所以也失效了,必须注意。
关于CSS hacks,可以看看以前的这两篇文章:
我们知道visibility:hidden和display:none都可以用来隐藏某个元素,其中的区别是visibility:hidden隐藏但保留其元素所占空间大小display:none隐藏并且不保留其元素所占空间大小
今天做项目的时候,需要用到visibility:hidden,但是一个以前没发现的问题出现了,为一个AA元素设定一个visibility:hidden,然后在AA元素下有一个设定了border:1px...;border-collapse: collapse;的table,table的td也设定了border:1px ...;,接着在IE下你就发现虽然table的内容被隐藏了,但是table下td的border依然在(恶搞,IE经常这么吓人)...
随后发现问题出在border-collapse: collapse;上,本来之所以设定border-collapse: collapse;是为了干掉IE下table默认的cellspacing,现在反而出现了新的问题。查了下border-collapse的属性
border-collapse属性可以决定表格的行和单元格的边是合并在一起还是按照标准的HTML样式分开。
简单来说collapse参数可以合并邻近单元格的边框。是不是IE在解释border-collapse: collapse;的时候有问题...
遇到同样的问题,你是怎么解决的?
今天做项目的时候,发现了这个诡异的问题:js动态创建的radio元素在IE下不能被选中的问题。
点这里看这个诡异的问题
第一种情况用document.createElement创建input元素,然后用setAttribute为它设定type=radio,不过在IE下的效果,一点便知,不能选择...
第二种情况用innerHTML直接把input type="radio" name="radio2"输出,确却是可以的,无语了...
希望知道原因的朋友不吝赐教。
在IE下,当一个HTML元素的属性改变的时候,都能通过 onpropertychange来捕获。例如一个<input name="text1" id="text1" />对象的value属性被页面的脚本修改的时候,onchange无法捕获到,而onpropertychange却能够捕获。
也就是说:onpropertychange能及时捕获属性值的变化,而onchange在属性值改变时还必须使得当前元素失去焦点(onblur)才可以激活该事件!如:
请输入图片地址:<input type="text" name="mytext" size="10" value="" onpropertychange="document.images['img'].src=this.value;" /><br /><br />
<img id="myimg" src="/img/common/logo.gif" alt="" />
当text框中的内容被改变时,图片就会立刻被显示出来。而如果用onchange时,改变其值时还需用鼠标单击空白或其他地方使input元素失去焦点(onblur)才能激活该事件,图片显示才会被改变!
今天作一个项目的时候遇到这个问题,试验了onchange、onkeyup、onpropertychange都不太理想,明天再继续看看。
MSDN上关于onpropertychange的解释