解决IE兼容H5的问题
Html5提供的一些新多媒体标签(header,article,aside,section,nav,figure,menu,footer)使用起来非常的方便,但是低版本的IE浏览器(IE6/IE7/IE8)对的这些新标签根本识别不了,解决这些问题要了解是浏览器无法识别这些标签,想办法让浏览器识别这些标签就可以了。有两种方案,自定义标签或者引入第三方兼容文件就可以了。
1.通过自定义标签解决
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8" /> <meta name="renderer" content="webkit"> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" /> <title>*****</title> </head> <style> nav{ height:200px; background:#f00; display:black; //设置为块级元素 } </style> <script> //通过创建一个标签来实现 document.createElement('nav'); </script> <body> <nav>这是一段文字</nav> </body> </html>
2.引入兼容文件JS
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8" /> <meta name="renderer" content="webkit"> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" /> <title>*****</title> [ if Ite IE8] <script src="../html5/libs/html5shiv.min.js"></script> [end if] </head> <style> nav{ height:200px; background:#f00; } </style> <body> <nav>这是一段文字</nav> </body> </html>