让IE6/IE7/IE8浏览器支持CSS3属性
一、下载
搜索下载:ie-css3.htc,它是让IE浏览器支持CSS3表现的关键。
二、上面的是什么东西
首先说说.htc文件,.htc文件是个脚本文件,个人以为与js文件属于同一货色,只是呢,貌似htc是Internet Explorer(IE)的私生子,只有IE才认它。htc文件可以用来描述web行为,web行为允许程序员把自定义的功能“连接”到现有的元素和控件,而不是必须让用户下载二进制文件(例如ActiveX 控件)来完成这个功能。
本文的这个ie-css3.htc,让IE浏览器支持CSS3的一些属性。没错,就是通过脚本为IE浏览器增加一些CSS3标准下的一些行为(比较流行的几种)。此htc第一段主要脚本如下:
function supportsVml() {if (typeof supportsVml.supported == "undefined") {var a = document.body.appendChild(document.createElement('div'));a.innerHTML = '<v:shape id="vml_flag1" adj="1" />';var b = a.firstChild;b.style.behavior = "url(#default#VML)";supportsVml.supported = b ? typeof b.adj == "object": true;a.parentNode.removeChild(a);}return supportsVml.supported }
明白人基本上都知道,这不跟js脚本一个模子里出来的嘛。也就是说,htc只是js脚本去韩国整了个容,换了副马甲而已。
三、如何工作的
要说工作原理,得有一个新角色粉墨登场,那就是“VML”。VML是The Vector Markup Language(矢量可标记语言)的缩写。VML用于将图形数据矢量化的标记语言。这是一种基于 XML 语法的语言,由 AutoDesk 、 Macromedia 和 Microsoft 和 HP 公司向 W3C 提出的方案。VML相当于IE里面的画笔,能实现你所想要的图形,而且结合脚本,可以让图形产生动态的效果。VML是微软1999年9月附带IE5.0发布的。
如果要我说的话,我觉得就是IE浏览器的御用画笔,专门给IE作画用的。于是呢IE私生子htc加上IE私有画笔VML就可以实现一些IE专有的图形与表现了,正好可以就此实现一些IE不支持的CSS3效果。
PS:
VML相当于IE里面的画笔,能实现你所想要的图形,而且结合脚本,可以让图形产生动态的效果。VML是微软1999年9月附带IE5.0发布的,在我认为, VML其实是Word和HTML结合的产物。可以将Word文档另存为HTML,其中的文本和图片可以很容易的转换,但如果是手绘制的图形在以往的IE里面就无法解释了,如果都转换成图形文件又不太现实。于是微软把Word里面的图形控件结合到IE里面,使IE也具备了绘图功能。
最初由Microsoft开发的XML词表,现在也只有IE5.0以上版本对VML提供支持。
使用VML可以在IE中绘制矢量图形,所以有人认为VML就是在IE中实现了画笔的功能。
四、如何使用
使用是很容易的,看下面的示例代码:
.box {-moz-border-radius: 15px; /* Firefox */-webkit-border-radius: 15px; /* Safari 和 Chrome */border-radius: 15px; /* Opera 10.5+, 以及使用了IE-CSS3的IE浏览器 */-moz-box-shadow: 10px 10px 20px #000; /* Firefox */-webkit-box-shadow: 10px 10px 20px #000; /* Safari 和 Chrome */box-shadow: 10px 10px 20px #000; /* Opera 10.5+, 以及使用了IE-CSS3的IE浏览器 */behavior: url(ie-css3.htc); /* 通知IE浏览器调用脚本作用于'box'类 */ }
可以看到,除了最后添加了behavior这么一句,CSS3属性还是那个CSS3属性,不需要化妆、修饰或是化身为变形金刚,这也是此方法的优点所在。
五、问题和必要的说明
毕竟不是浏览器自带的属性,使用时遇到问题在所难免,这里说一下一些注意事项,也可以说是方法的局限性吧:
当前元素一定要有定位属性,像是position:relative或是position:absolute属性。
z-index值一定要比周围元素的要高,否则……只能说抱歉了~~
六、支持的样式及状态说明
参见下表:
样式 | 生效 | 无效 |
---|---|---|
border-radius |
为元素四个角设置圆角属性 元素边框 |
只设置一个角落的圆角属性 |
box-shadow |
模糊大小参数 偏移值 |
不支持除了黑色(#000)以外的其他颜色 |
text-shadow |
模糊大小参数 偏移值 颜色值 |
IE下的表现与Firefox/Safari/Chrome有一点点的差异,原因不详 |
让IE6/IE7/IE8浏览器支持CSS3属性相关推荐
- html不支持ie7,解决IE6/IE7/IE8不支持before,after问题
对从事web开发的朋友来讲,低版本的永远是一个痛点,不支持最新技术(如css3,html5). 在现在web开发中使用图标字体已经很广泛,如Font Awesome,Bootstrap等,字体图片主要 ...
- 解决IE6/IE7/IE8不支持before,after问题
对从事web开发的朋友来讲,低版本的 IE 永远是一个痛点,不支持最新技术(如css3,html5). 在现在web开发中使用图标字体已经很广泛,如Font Awesome,Bootstrap等,字体 ...
- IE(IE6/IE7/IE8)支持HTML5标签--20150216
让IE(ie6/ie7/ie8)支持HTML5元素,我们需要在HTML头部添加以下JavaScript,这是一个简单的document.createElement声明,利用条件注释针对IE来调用这个j ...
- 伪元素(3)-解决IE6/IE7/IE8不支持before,after问题
第一种解决方式参考: http://www.wozhuye.com/index.php?m=content&c=index&a=show&catid=3&id=316 ...
- NanShan即时通讯 ie6 ie7 ie8 不支持json 终极解放方案
网上真的是各种大神都有啊,NanShan即时通讯 开发JSON程序时遇到的问题,终于解决了,非常感谢.为了测试更方便,一般我使用 Web API 都会设置让 Web API 返回 Json 格式.在I ...
- calc ie支持_让IE6/IE7/IE8支持CSS3属性的8种方法介绍
让IE6/IE7/IE8支持CSS3属性的8种方法介绍 发布时间:2013-09-23 10:43:06 作者:佚名 我要评论 IE浏览器暂不支持CSS3的一些属性.国外的工程师们,不安于此现 ...
- 让IE6/IE7/IE8支持CSS3的8种方法
我们都知道,IE浏览器暂不支持CSS3的一些属性.国外的工程师们,不安于此现状,他们总是尽量使用一些手段使IE浏览器也能支持CSS3属性,我觉得这些都是很有意义,很有价值的工作,可以推动整个技术领域的 ...
- 如何让IE6/IE7/IE8支持HTML5标签
让IE(ie6/ie7/ie8)支持HTML5元素,我们需要在HTML头部添加以下JavaScript,这是一个简单的document.createElement声明,利用条件注释针对IE来调用这个j ...
- ie8浏览器html圆角问题,IE7,IE8浏览器CSS实现正圆角效果代码
圆角效果以前用的是图片实现现在我们来用css实现了,下面来看一篇非常详细的关于IE7,IE8浏览器CSS实现正圆角效果代码吧,希望文章能够帮助到各位朋友. 一.关于IE7, IE8不支持CSS3 bo ...
最新文章
- IE6,7,8中兼容css3圆角问题
- 转:中国学生为什么学不好计算机 谭浩强
- 如何手工删除AD RMS SCP?
- Python 基础语法(一)
- 固定资产拆分比例怎么计算_持有的基金要被份额拆分?对收益有影响吗?
- Consul etcd ZooKeeper euerka 对比
- 计算机网络讨论4,计算机网络实验四
- java期末试题c卷,JAVA程序设计期末考试试卷及参考答案
- 信息学奥赛一本通 1013:温度表达转化 | OpenJudge NOI 1.3 08
- Jquery与.net MVC结合,通过Ajax
- 列表推导式三种模式和生成器
- 【PS图像处理】修改图层中文字图形的颜色
- QQ空间、新浪微博、腾讯微博等一键分享API链接代码
- linux如何备份内核,Linux 中我该如何备份系统
- [英语语法]句法之主谓一致
- 梦想世界3手游服务器维护,梦想世界手游进不去 闪退及登录不上解决方法
- 探索R包plyr:脱离R中显式循环
- 鸿蒙系统兼容微软,效仿华为鸿蒙系统!微软放大招:新版Win10系统兼容安卓应用...
- 涡街流量计对蒸汽流量计量的精度要求
- Linux上的集成开发环境
热门文章
- 四大门户免费企业邮箱用户端基础参数对比
- 基于JSP的在线学习网站的设计与实现
- java服务器端集成微信小程序
- SAP中科目货币及本位币记账控制测试
- 密苏里大学计算机排名,2019上海软科世界一流学科排名计算机科学与工程专业排名密苏里大学排名第301-400...
- 计算机专业论文 方向,计算机专业本科生方向论文题目 计算机专业本科生论文题目怎样取...
- 一次Linux中的木马病毒解决经历
- elementUI checkbox选中与取消选中
- 九天揽月带你玩转EKF纸老虎(3)
- 程序员和自由工作者如何去找兼职