搜索
分类
- HTML & CSS (38)
- Javascript (11)
- jQuery (13)
- Photoshop (6)
- RIA (4)
- Software (15)
- Wordpress (11)
- 用户体验 (8)
- 随便聊聊 (12)
-
最新日志
文章
标签云
功能
Tag Archives: IE
IE6下实现png图片半透明的常用方法
IE6是个”神奇”的浏览器,其原因想必做前端的同行们都深有体会,:)作为我个人而言,最反感的就是IE6不支持除A以外的hover伪类,再一个就是它不支持png图片的alpha透明度.当然此类问题已有众多的解决方案,这里只是总结下自己常用的IE6下实现png半透明的方法以及适用环境. 1.使用滤镜,适用于单一png背景图片的快速部署;弊端:消耗资源比较多,方法比较繁琐. < !DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>ie6下png透明-iinterest</title> <style type="text/css"> *{margin:0; padding:0;} .box{ width:958px; height:512px; background:url(http://image215.poco.cn/mypoco/myphoto/20091114/16/51737245200911141635177073974043057_000.jpg) no-repeat; } .png-bg{width:341px; height:258px; margin:60px auto 0; background:url(http://www.iinterest.net/wp-content/uploads/2009/11/windows.png) no-repeat; _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=’http://www.iinterest.net/wp-content/uploads/2009/11/windows.png’); _background-image:none; } </style> </head> <body> <div class="box"> <div … Continue reading
针对IE8的HACK
前段时间费了好大的劲才弄了个伪IE8 hack(关于IE8的HACK)…最近发现原来IE8是存在私有hack的,真悲剧… background:#ff6600\0; /*IE8 hack*/ 测试: <!DOCTYPE html> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>CSS阴影</title> <style type="text/css"> div{ width:100px; height:100px; background:#f1f1f1; background:#ff6600\0;} </style> </head> <body> <div>这个盒子的背景在IE8下是橙色的</div> </body> </html> 提示:你可以先修改部分代码再运行。
关于IE8的HACK
这篇文章悲剧了…请移步针对IE8的HACK 这里介绍的IE8 hack其实名不副实,因为目前我还未找IE8的私有hack,记得beta时期有过,但那些hack在随后的正式版中被修复了,囧.所以IE8的hack其实就是其他浏览器hack的集合…看个例子: select{ left:-57px; left:4px\9; #left:-57px; _left:-57px;} left:-57px; 全局定义,所有浏览器都识别 [FF,chrome] left:4px\9; IE hack,非IE浏览器无法识别 [IE8] #left:-57px; IE7,6 识别 [IE7] _left:-57px; IE6 识别 [IE6] 从例子可以看出,先是通过②定义全部IE的样式,再通过③④覆盖定义IE7,6的样式,这样使得IE8的最终解析为 left:4px\9; 虽然复杂了点,但还是可以达到预期的效果…不过最后还是啰嗦一句:Hack就像是止痛药,必要的时候还是可以救急,但滥用的话后果很严重…
关于IE8的兼容性问题
最近装了win7,体验了下传说中的IE8,作为一个用户而言,IE8的速度和稳定性相对于IE6,7都有很大的提升,但还是存在许多兼容性问题,所以我一直想把win7上的IE8降级为I7,但至今都没有找到方法.如果你跟我一样,或者你喜欢IE8的速度,只是对他的兼容性颇有微词,那么你可以: 点击IE8右上部的”页面”->”兼容性设置”,点选”在兼容性视图中显示所有网站”,或者自己指定也行. 作为web设计师,你也不必对IE8的兼容性问题感到头痛,你只用加一句代码就可以让IE8进入兼容模式 <meta http-equiv=”X-UA-Compatible” content=”IE=EmulateIE7″ />
IE下绝对定位的BUG
项目中经常会用到层的绝对定位,但在IE6,IE7中它的表现却与其他浏览器存在差异,姑且算是一个IE的BUG吧(IE8除外). 先来看看这个BUG的触发条件: 先建立一个简单的模型,一个有固定宽度水平居中的容器wrapper,一个绝对定位的层position-box;这里讨论的是position-box并未设置left,right,top,bottom等属性的情况下的效果,这时候position-box对象会遵从正常的HTML布局规则,在前一个对象之后立即被呈递. < !DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>iinterest</title> <style type="text/css"> *{ margin:0; padding:0;} .wrapper{ width:600px; height:300px; margin:0 auto; background:#FC3; overflow:hidden; } .position-box{ position:absolute; width:100px; height:100px; background:#6CF;} </style> … Continue reading