HTML5---2.语义化标签的兼容性问题以及解决方案

1.原理：动态创建元素
例如：document.createElement(“header”)
注意：动态创建出来的标签是行内元素，需添加display:block
/IE9:行级元素在设置宽度的时候是失效
IE8:完全不支持语义标签(不支持html5):在IE8中，它不认识语义标签，所以无法解析这些标签，也就意味着所写的样式无效。/

<style>
    main{
            /*将行级元素转换为块级元素*/
            display: block;
            width: 100%;
            height: 500px;
            background-color: #ccc;
        }
        main > article{
            width: 80%;
            height: 100%;
            background-color: purple;
            float: left;
        }
        main > aside{
            width: 20%;
            height: 100%;
            background-color: pink;
            float: right;
        }
</style>

2.应用
在实际开发当中，可以引入html5shiv.js 插件

html5shiv 是一个针对 IE 浏览器的 HTML5 JavaScript 补丁，目的是让 IE 识别并支持 HTML5 元素。

转载于:https://www.cnblogs.com/Tobenew/p/10506643.html