IE8的一些兼容问题

最新推荐文章于 2019-02-26 20:05:00 发布

荷兰豆叶子上的水熊

最新推荐文章于 2019-02-26 20:05:00 发布

阅读量161

点赞数

分类专栏：兼容文章标签： ie8兼容

本文链接：https://blog.csdn.net/u010200033/article/details/80272201

版权

兼容专栏收录该内容

1 篇文章 0 订阅

订阅专栏

1）对部分css3的支持 =》方法使用插件 css3pie.htc

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <style type="text/css">
            .box{
                position:relative;
                z-index: 2;
                width: 200px;height: 200px;
                border:2px solid #ccc;
                border-radius: 50%;
                behavior: url(./css/PIE.htc); 

            }
        </style>
    </head>
    <body>
        <div class="box"></div>
    </body>
</html>

2）让ie8支持媒体查询使用 response.js 处理这个问题

3）识别h5标签使用 html5shiv

---------------------------------样式分界线-------------------------------------------

1) max-width 问题

2）placeholder不支持

解决方法引入jquery.placeholder.js去解决

3）兼容 display:inline-block的方法

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <style type="text/css">
            ul li{
                list-style: none;
                display: inline-block;
                *display:inline;
                *zoom:1; 
                padding: 5px 10px;
                border:1px solid #ccc;
            }
        </style>
    </head>
    <body>
        <ul>
            <li>笑嘻嘻</li>
            <li>笑嘻嘻</li>
            <li>笑嘻嘻</li>
        </ul>
    </body>
</html>

4）不支持last-child 解决方案给最后元素加类名

5）background-size ie8不支持解决方案：滤镜

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <style type="text/css">
            .box{
                width: 500px;height: 500px;border:3px solid #ccc;
                background: url("images/bb1.jpg") no-repeat;
                background-size: cover;
                /*background: none\9;*/
                /*下一行为关键设置*/
                filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='images/bb1.jpg', sizingMethod='scale');
            }
        </style>
    </head>
    <body>
       <div class="box">
           
       </div>
    </body>
</html>

---------------js兼容------------------------------------------------

es6用babel解析

无法使用forEach string.trim 自己写一个方法

荷兰豆叶子上的水熊

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
IE8的一些兼容问题

1）对部分css3的支持 =》方法使用插件 css3pie.htc&lt;!DOCTYPE html&gt;&lt;html lang="en"&gt; &lt;head&gt; &lt;meta charset="utf-8"&gt; &lt;style type="text/css"&gt; .b
复制链接

扫一扫

专栏目录