本来从css3兼容ie9+挺好的,可是总有一些共识要求ie8+,于是就有了我们的苦逼的找解决办法。之前在网上查到一些说用 PIE.htc.

But 我就是按照他说的写的没有管用。请教了一下别人才会写了。就我遇到的问题来说吧。

先说 box-shadow:

<style>

.div{

width:500px;

height:200px;

border: 1px solid #eaeaea;

behavior: url(pie.htc);

-moz-box-shadow: 0px 0px 14px 1px #eaeaea;

-webkit-box-shadow: 0px 0px 14px 1px #eaeaea;

box-shadow: 0px 0px 14px 1px #eaeaea;

}

</style>

<div class="div">

边框阴影
</div>

可是ie8下不支持就加上PIE.htc,注意上边的连接地址,需要注意的有两点:

1.这个文件应该放到和.html文件同级位置。(下载地址:http://css3pie.com/download/)

  这个就可以

2.虽然文件名称是大写,如果确保路径没问题还不管用时候就试试小写

border-radius:

这个是在做上传头像时候。就是不管你的头像是什么形状,放进去后就是圆的,类似于这样

里边的图片就是这样的,

同样的

<style>

p{

width: 135px;

height: 135px;

border: 1px solid #ddd; 

text-align: center; 

behavior: url(pie.htc);

border-radius: 50%; 

overflow: hidden;

}

</style>

<p>
<img src="data:images/ac1.jpg" alt="" width="232">
</p>

可是ie8下不支持就加上PIE.htc,注意上边的连接地址,需要注意的有两点:

1.这个文件应该放到和.html文件同级位置。(下载地址:http://css3pie.com/download/)

  这个就可以

2.虽然文件名称是大写,如果确保路径没问题还不管用时候就试试小写

最后找解决办法的时候发现PIE.htc这个还是可以解决好多属性值,因为没用到就不一 一说了,有兴趣的可以自己去查查。

介绍htc,它可以让IE浏览器支持CSS3的border-radius、box-shadow、border-image、CSS3 Backgrounds (-pie-background)、Gradients、RGBA属性。。(可以参考这个  https://zhidao.baidu.com/question/2119635727166906667.html)

关于box-shadow、border-radius不兼容ie8的解决办法的更多相关文章

  1. CSS常见兼容问题以及解决办法

    浏览器的兼容性问题,通常是因为不同的浏览器对同一段代码有不同的解析,造成页面显示不统一的情况. 这里谈到的浏览器,主要指IE6/IE7/IE... FireFox Chrome Opera Safar ...

  2. css 浏览兼容问题及解决办法 (2)

    1.div的垂直居中问题 vertical-align:middle; 将行距增加到和整个DIV一样高 line-height:200px; 然后插入文字,就垂直居中了.缺点是要控制内容不要换行 2. ...

  3. HTML兼容问题及解决办法

    标准浏览器子元素不会撑开父元素设置好的宽度,IE6下会的: <style> .box{ width:400px;} .left{ width:200px;height:300px;back ...

  4. bootstrap不兼容ie8如何解决

    说起bootstrap大家一定都不陌生,可以说是目前最受欢迎的前端框架,简洁.直观.强悍.移动设备优先的前端开发框架,让web开发更迅速.简单. 但是在实际运用中也会遇到各种各样的问题,比如最近项目中 ...

  5. 解决IE8下不兼容rgba()的解决办法

    rgba()是css3的新属性,所以IE8及以下浏览器不兼容,这怎么办呢?终于我找到了解决办法. 解决办法 我们先来解释以下rgba rgba: rgba的含义,r代表red,g代表green,b代表 ...

  6. css 浏览兼容问题及解决办法 (1)

    主流浏览器css兼容问题的总结 最近又搞了一波网站的兼容,由于要求ie浏览器还是要兼容到ie8,所以调起来还是各种蛋疼. 现在就post一些做兼容的总结,可能不够全面,但是可以告诉大家如何避过一些坑. ...

  7. div+css常见浏览器兼容问题以及解决办法

    1.图片下方出现几像素的空白间隙问题说明:这个问题在ie6和ff(火狐)下经常见到,例如 <div><img src=""/></div>这个图 ...

  8. js 浏览器兼容问题及解决办法

    JS中出现的兼容性问题的总结 1.关于获取行外样式 currentStyle 和 getComputedStyle 出现的兼容性问题  我们都知道js通过style不可以获取行外样式,当我们需要获取行 ...

  9. 用javascript操作xml(三)关于Jquery的html()不兼容IE的解决办法

    当 $("#xxx").html(data); 不兼容,方法替换为 document.getElementById("xxx").innerHTML=data;

随机推荐

  1. Java-数据结构与算法-选择排序与冒泡排序

    Java 选择排序与冒泡排序 1.DataSorter.java public class DataSorter { //冒泡排序法 //主要思路:按升序排序,数组元素两两比较,大的立即排后面 pub ...

  2. GCD 学习(八)dispatch_semaphore

    dispatch_semaphore 信号量基于计数器的一种多线程同步机制.在多个线程访问共有资源时候,会因为多线程的特性而引发数据出错的问题.     dispatch_queue_t queue ...

  3. Entity Framework Tutorial Basics(34):Table-Valued Function

    Table-Valued Function in Entity Framework 5.0 Entity Framework 5.0 supports Table-valued functions o ...

  4. 数据结构与算法(Java版)_堆

    完全二叉树叫做堆. 完全二叉树就是最后一个节点之前不允许有不满的节点,就是不允许有空洞. 可以使用数组来做完全二叉树(堆). 堆分为大顶堆和小顶堆.大顶堆就是根节点上的数字是最大的,小顶堆就是根节点上 ...

  5. c#继承、多重继承

    c#类 1.c#类的继承 在现有类(基类.父类)上建立新类(派生类.子类)的处理过程称为继承.派生类能自动获得基类的除了构造函数和析构函数以外的所有成员,可以在派生类中添加新的属性和方法扩展其功能.继 ...

  6. [转]Marshaling a SAFEARRAY of Managed Structures by P/Invoke Part 2.

    1. Introduction. 1.1 In part 1 of this series of articles, I explained how managed arrays may be tra ...

  7. unity网络延迟

    using UnityEngine; using System.Collections; public class Test_Ping : MonoBehaviour { public string ...

  8. Linux 下的 etc

    /etc etc不是什么缩写,是and so on的意思 来源于 法语的 et cetera 翻译成中文就是 等等 的意思. 至于为什么在/etc下面存放配置文件, 按照原始的UNIX的说法(linu ...

  9. Java 大数相乘、大数相加、大数相减

    思路来源:: https://blog.csdn.net/lichong_87/article/details/6860329 /** * @date 2018/6/22 * @description ...

  10. flink学习笔记-各种Time

    说明:本文为<Flink大数据项目实战>学习笔记,想通过视频系统学习Flink这个最火爆的大数据计算框架的同学,推荐学习课程: Flink大数据项目实战:http://t.cn/EJtKh ...