IE中的CSS3不完全兼容方案

作者：零度水163 | 来源：互联网 | 2014-09-19 16:29

原文地址：http:www.phpthinking.comarchives367到InternetExplorer8为止，IE系列是不支持CSS3的。在IE中要做一些常用的效果如圆角、阴影，就需要用一些冗余而无意义的元素和图片来做出这些效果。在厌倦这些后，就想着用更为简洁、直接有效、CSS3式的办法来解决这些问题。

原文地址：http://www.phpthinking.com/archives/367

到Internet Explorer 8为止，IE系列是不支持CSS3的。在IE中要做一些常用的效果如圆角、阴影，就需要用一些冗余而无意义的元素和图片来做出这些效果。在厌倦这些后，就想着用更为简洁、直接有效、CSS3式的办法来解决这些问题。好在就算是饱受批评的Internet Explorer，其本身也是足够强大的。IE特有的技术可以很好的实现一些CSS3的效果。

Opacity透明度

元素的透明度在IE中可以很方便的用滤镜来实现。

1

background-color:green;

2

opacity:
 .4;

3

filter:progid:DXImageTransform.Microsoft.alpha(opacity=40);

border-radius圆角/Box Shadow盒阴影/Text Shadow文字阴影

在IE中可以利用Vector Markup Language (VML)和Javascript来实现这些效果，，在引用了一个HTC文件后，在IE浏览器中就可以使用这三种CSS3属性了。

`1`	`-moz-border-radius:` `15px;` `/* Firefox */`

`2`	`-webkit-border-radius:` `15px;` `/* Safari 、Chrome */`

`3`	`border-radius:` `15px;` `/* Opera 10.5&＃43;, IE6&＃43; 使用 IE-CSS3*/`

`4`	`-moz-box-shadow:` `5px` `5px` `5px` `#000;` `/* Firefox */`

`5`	`-webkit-box-shadow:` `5px` `5px` `5px` `#000;` `/* Safari、Chrome */`

`6`	`box-shadow:` `5px` `5px` `50px` `#000;` `/* Opera 10.5&＃43;，IE6&＃43; 使用 IE-CSS3 */`

`7`	`behavior:` `url(ie-css3.htc);` `/引用ie-css3.htc /`

推荐阅读

io
常用的CSS属性及用法整理

本文整理了常用的CSS属性及用法，包括背景属性、边框属性、尺寸属性、可伸缩框属性、字体属性和文本属性等，方便开发者查阅和使用。 ... [详细]

蜡笔小新 2023-12-09 03:01:43
function
Voicewo在线语音识别转换jQuery插件的特点和示例

本文介绍了一款名为Voicewo的在线语音识别转换jQuery插件，该插件具有快速、架构、风格、扩展和兼容等特点，适合在互联网应用中使用。同时还提供了一个快速示例供开发人员参考。 ... [详细]

蜡笔小新 2023-12-13 20:01:16
function
css元素可拖动,如何使用CSS禁止元素拖拽？

一、用户行为三剑客以下3个CSS属性：user-select属性可以设置是否允许用户选择页面中的图文内容；user-modify属性可以设置是否允许输入 ... [详细]

蜡笔小新 2023-10-17 14:35:15
function
微信小程序打开红包的css_【微信小程序】——wxss引用外部CSS文件及iconfont

小程序引入外部文件的方式是：import**.wxss;因为业务需要，正在开发的小程序中需要使用iconfont，很容易想到了H5的引 ... [详细]

蜡笔小新 2023-10-13 13:30:45
function
ECMA262规定typeof操作符的返回值和instanceof的使用方法

本文介绍了ECMA262规定的typeof操作符对不同类型的变量的返回值，以及instanceof操作符的使用方法。同时还提到了在不同浏览器中对正则表达式应用typeof操作符的返回值的差异。 ... [详细]

蜡笔小新 2023-12-10 17:31:51
main
CSS |网格行结束属性

CSS|网格-行-结束属性原文:https://www.gee ... [详细]

蜡笔小新 2023-10-17 15:21:56
io
CSS背景位置y | backgroundpositiony

css,背景,位置,y,background, ... [详细]

蜡笔小新 2023-10-16 16:28:38
go
前端提高篇(七十)：SVG基本使用、基本样式、路径path

SVG是使用XML来描述二维图形和绘图程序的语言。SVG遵循的是xml的规范，与html5的使用有所区别SVG绘制出来的是矢量图，放大之后不会失真官方文 ... [详细]

蜡笔小新 2023-10-14 15:30:33
header
nginx 解决跨域问题 No: 'AccessControlAllowOrigin' header is present on the requested resource

错误信息：1， ... [详细]

蜡笔小新 2023-10-13 12:38:39
header
Python瓦片图下载、合并、绘图、标记的代码示例

本文提供了Python瓦片图下载、合并、绘图、标记的代码示例，包括下载代码、多线程下载、图像处理等功能。通过参考geoserver，使用PIL、cv2、numpy、gdal、osr等库实现了瓦片图的下载、合并、绘图和标记功能。代码示例详细介绍了各个功能的实现方法，供读者参考使用。 ... [详细]

蜡笔小新 2023-12-13 12:14:55
get
Ubuntu下创建deb安装包及离线安装包制作的方法

本文介绍了在Ubuntu下制作deb安装包及离线安装包的方法，通过备份/var/cache/apt/archives文件夹中的安装包，并建立包列表及依赖信息文件，添加本地源，更新源列表，可以在没有网络的情况下更新系统。同时提供了命令示例和资源下载链接。 ... [详细]

蜡笔小新 2023-12-10 21:32:50
go
Hive常用命令及其用途

本文介绍了Hive常用命令及其用途，包括列出数据表、显示表字段信息、进入数据库、执行select操作、导出数据到csv文件等。同时还涉及了在AndroidManifest.xml中获取meta-data的value值的方法。 ... [详细]

蜡笔小新 2023-12-09 09:30:10
go
Signing Identities, Missing Private Key, Cannot sign App

这个问题发生在重新安装系统后，丢失了之前的privatekey等。所以解决方法就是提示的revokeandrequest。到developercenter中找到certificat ... [详细]

蜡笔小新 2023-10-15 12:07:56
get
发现一个好看的手机壁纸网站，撸代码的手已经饥渴难耐了

本文的文字及图片来源于网络,仅供学习、交流使用,不具有任何商业用途,版权归原作者所有,如有问题请及时联系我们以作处理。最近有同学的爬虫代码出了bug，给问我怎么改于 ... [详细]

蜡笔小新 2023-10-13 11:57:49
header
whitepages 爬取_爬取新笔趣阁小说！适合新手入门的小案例

爬取笔趣阁小说(搜索爬取)首先看看最终效果(gif)：实现步骤：1.探查网站“http:www.xbiquge.la”，看看网站的实现原理 ... [详细]

蜡笔小新 2023-10-13 11:41:31

零度水163

这个家伙很懒，什么也没留下！

Tags | 热门标签

RankList | 热门文章