低版本浏览器支持HTML5标签的方法
最近刷了一道面试题,是关于低版本浏览器支持HTM5标签的写法,在网上找了一些,都行之有效,但是缺少整体总结,所以在这里总结一下,方便其他人过来阅读。
IE低版本需要支持HTML5标签:
方法1.传统引入js包
[javascript]view plaincopy print ?
注:js包(html5.js)内容:
[javascript]view plaincopy print ?
- // html5shiv MIT @rem remysharp.com/html5-enabling-script
- // iepp v1.6.2 MIT @jon_neal iecss.com/print-protector
- /*@cc_on(function(m,c){var z="abbr|article|aside|audio|canvas|details|figcaption|figure|footer|header|hgroup|mark|meter|nav|output|progress|section|summary|time|video";
function n(d){for(var a=-1;
++a
- "gi"),t=RegExp("<(/*)("+z+")","gi"),u=RegExp("(^|[^\\n]*?\\s)("+z+")([^\\n]*)({[\\n\\w\\W]*?})","gi"),r=c.createDocumentFragment(),k=c.documentElement; g=k.firstChild; var h=c.createElement("body"),l=c.createElement("style"),f; n(c); n(r); g.insertBefore(l,
- g.firstChild); l.media="print"; m.attachEvent("onbeforeprint",function(){var d=-1,a=p(c.styleSheets,"all"),e=[],b; for(f=f||c.body; (b=u.exec(a))!=null; )e.push((b[1]+b[2]+b[3]).replace(s,"$1.iepp_$2")+b[4]); for(l.styleSheet.cssText=e.join("\n"); ++d
- function(){h.innerHTML=""; k.removeChild(h); k.appendChild(f); l.styleSheet.cssText=""})}})(this,document); @*/
方法2.在hmtl 加入(推荐)
[javascript]view plaincopy print ?
- /*html5 tag*/
什么是浏览器兼容:
当我们使用不同的浏览器(Firefox IE7 IE6)访问同一个网站,或者页面的时候,会出现一些不兼容的问题,有的显示出来正常,有的显示出来不正常,我们在编写CSS的时候会很恼火,刚修复了这个浏览器的问题,结果另外一个浏览器却出了新问题。而兼容就是一种办法,能让你在一个CSS里面独立的写支持不同浏览器的样式。这下就和谐了!
有一点逻辑思想的人都会知道可以用IE和FF的兼容结合起来使用。
下面介绍三个兼容,例如:(适合新手,呵呵,高手路过。)
[css]view plaincopy print ?
- _height:100px; //ie6
- *height:100px; //ie7一般放在ie6前面
- height:100px \9\0; //ie9
- -moz-height:100px//ff
- -webkit-height:100px//-webkit- 浏览器引擎:Safari,chrome,qq,opers....
IE的if条件Hack
[css]view plaincopy print ?
- 1. 〈!--[if !IE]〉〈!--〉 除IE外都可识别 〈!--〈![endif]--〉
- 2. 〈!--[if IE]〉 所有的IE可识别 〈![endif]--〉
- 3. 〈!--[if IE 5.0]〉 只有IE5.0可以识别 〈![endif]--〉
- 4. 〈!--[if IE 5]〉 仅IE5.0与IE5.5可以识别 〈![endif]--〉
- 5. 〈!--[if gt IE 5.0]〉 IE5.0以及IE5.0以上版本都可以识别 〈![endif]--〉
- 6. 〈!--[if IE 6]〉 仅IE6可识别 〈![endif]--〉
- 7. 〈!--[if lt IE 6]〉 IE6以及IE6以下版本可识别 〈![endif]--〉
- 8. 〈!--[if gte IE 6]〉 IE6以及IE6以上版本可识别 〈![endif]--〉
- 9. 〈!--[if IE 7]〉 仅IE7可识别 〈![endif]--〉
- 10. 〈!--[if lt IE 7]〉 IE7以及IE7以下版本可识别 〈![endif]--〉
- 11. 〈!--[if gte IE 7]〉 IE7以及IE7以上版本可识别 〈![endif]--〉
注:gt = Great Then 大于
〉 = 〉 大于号
lt = Less Then 小于
〈 = 〈 小于号
gte = Great Then or Equal 大于或等于
lte = Less Then or Equal 小于或等于
【低版本浏览器支持HTML5标签的方法】转载于:https://www.cnblogs.com/Sherlock09/p/7064719.html
推荐阅读
- 低头思故乡——只是因为睡不着
- 【Hadoop踩雷】Mac下安装Hadoop3以及Java版本问题
- 操作系统|[译]从内部了解现代浏览器(1)
- 《低风险创业》樊登
- 世界之大,包罗万象--|世界之大,包罗万象-- 读《我不过低配的人生》
- 103
- 分享!如何分分钟实现微信扫二维码调用外部浏览器打开指定页面的功能
- 日更82/365珍视生命中的每一刻
- 低调做人是一种智慧
- C语言的版本比较