码迷,mamicode.com
首页 > Web开发 > 详细

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

时间:2019-03-10 20:38:56      阅读:213      评论:0      收藏:0      [点我收藏+]

标签:引入   html   创建   创建元素   round   应用   完全   create   htm   

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 元素。

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

标签:引入   html   创建   创建元素   round   应用   完全   create   htm   

原文地址:https://www.cnblogs.com/Tobenew/p/10506643.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!