兼容ie6+的阴影

最新推荐文章于 2024-07-08 11:32:20 发布
最新推荐文章于 2024-07-08 11:32:20 发布
阅读量159 收藏
点赞数
分类专栏： 前端 文章标签： css
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_43949291/article/details/87860548
版权 
.shadow｛    width: 220px;
   height: auto;
   	padding: 5px;
    border: #909090 1px solid;
    background: #fff;
    color: #333;
    filter: 	progid:DXImageTransform.Microsoft.Shadow(color=#e4e4e4,direction=120,strength=4); /*ie*/
    -moz-box-shadow: 2px 2px 10px #e4e4e4; /*firefox*/
    -webkit-box-shadow: 2px 2px 10px #e4e4e4; /*safari或chrome*/
    box-shadow: 2px 2px 10px #e4e4e4; /*opera或ie9*/
    ｝
拾叶丿
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
.net core 调试时实时更新页面
qq_43949291的博客
08-31 365
.net core 调试时页面预览
Python文件打包为可执行程序
qq_43949291的博客
04-24 410
Python文件打包为可执行程序
兼容ie6、7的阴影效果
u010818109的博客
09-02 709
来源：[url]http://www.zhangxinxu.com/wordpress/2010/04/css%E5%AE%9E%E7%8E%B0%E8%B7%A8%E6%B5%8F%E8%A7%88%E5%99%A8%E5%85%BC%E5%AE%B9%E6%80%A7%E7%9A%84%E7%9B%92%E9%98%B4%E5%BD%B1%E6%95%88%E6%9E%9C/[/url] ...
html文字阴影兼容ie,纯css实现兼容ie6，IE7,IE8,火狐ff浏览器的div边框阴影效果
weixin_35560840的博客
06-19 294
非常漂亮的纯css实现兼容ie6，IE7,IE8,火狐ff浏览器的div边框阴影效果以上只是一个截图主要代码说明上面的div就是要实现边框阴影效果的divcss代码如下.lunquan{width:97%;margin:auto;overflow:hidden;margin-top:20px;border:#909090 1px solid;background:#fff;color:#333;f...
兼容ie的内阴影和外阴影实现效果及测试代码
09-25
关于阴影这个效果，IE和W3C都有实现的代码；本文介绍一下W3C实现阴影效果与ie阴影效果的实现与IE的模糊效果的实现，感兴趣的朋友可以了解下，希望本文对你有所帮助
DIV圆角+阴影+浏览器兼容
12-12
`DIV`圆角、阴影以及浏览器兼容性是前端开发中的常见问题，尤其是在跨浏览器的场景下。本文将深入探讨如何实现`DIV`的圆角、阴影效果，并确保在不同浏览器上具有良好的兼容性。 首先，我们来谈谈`DIV`的圆角。在CSS...
兼容IE的C3
11-03
"兼容IE的C3"是一个解决此类问题的技术方案，旨在使IE浏览器能够支持CSS3的一些关键属性，如圆角、渐变和阴影等，从而提供与现代浏览器接近的用户体验。 首先，让我们详细了解一下CSS3中的这些关键特性： 1. **...
解决IE浏览器兼容问题
03-04
2. **CSS兼容性**：IE浏览器对CSS2.1及以下支持较好，但对于CSS3的部分特性，如边框半径、阴影、渐变等，各版本支持程度不一。需要借助特定的前缀，如 `-ms-` ，来实现兼容。 3. **JavaScript兼容**：IE8及以下版本...
让IE6、IE7、IE8支持CSS3的圆角、阴影样式
qq_37555524的博客
09-18 184
但凡是前端工程师，都知道IE6，IE7，IE8不支持、或者不完全支持CSS3的属性。 CSS3 有很多很强大、绚丽的效果，比如，圆角，阴影，渐变透明，渐变背景，等等。 因为IE6时代，没有什么标准，而...
让IE6显示阴影
cangkukuaimanle——你满了么
11-12 2905
大家都知道，想让一个div显示有阴影效果，一般是加背景图片，这里提供了两个方法，不用加背景图片的方法，甚至让该死的IE6上也有效果，而且还是圆角的哦 方法一： 下载ie-css3.htc的文件，文本打开后，就是js代码，如下，可以拷贝粘贴保存： --Do not remove this if you are using-- Original Author: Remiz Rahnas Orig
IE6、IE7、IE8实现盒子阴影shadow
Daisukes的博客
11-14 6271
通常，我们实现盒阴影都是通过这段代码来实现的 -moz-box-shadow: 3px 3px 4px #000; -webkit-box-shadow: 3px 3px 4px #000; box-shadow: 3px 3px 4px #000; 　　但是，IE6、7、8不认识这段样式，所以我们会考虑用滤镜
CSS里的几个小知识
最新发布
07-08 327
在 中，rel=“stylesheet” 表示被链接的文档（即 mystyle.css）是一个样式表（style sheet），用于为当前页面提供样式定义。在 HTML 中，用于指定链接指向的资源地址。标签的属性，可以帮助搜索引擎更好地理解和索引网页，优化页面在不同设备上的显示，以及实现一些特定的功能，如自动刷新、设置字符集等。1、“rel” 是 “relation” 或 “relationship” 的缩写，意思是“关系；在 HTML 中， 标签的 rel 属性用于定义当前文档与被链接文档之间的关系。
CSS 【详解】样式选择器（含ID、类、标签、通配、属性、伪类、伪元素、Content属性、子代、后代、兄弟、相邻兄弟、交集、并集等选择器）
朝阳39的博客
07-06 1025
idCSS 样式选择器，用于选中页面中的 html 元素，以便添加 CSS 样式。
html+JavaScript+css 24点计算器
w11111xxxl的博客
07-03 1087
body {margin: 0;padding: 0;h1 {button {.results {
html+js+css在线倒计时
w11111xxxl的博客
07-05 844
距离下班还1分钟倒计时
CSS Float（浮动）
07-05 408
CSS Float（浮动）是一种布局技术，它允许开发人员将元素（如图片或文本）沿着其容器的左侧或右侧放置，并且让其他内容围绕它流动。这种技术在过去被广泛用于创建多栏布局，尽管现代CSS提供了更多高级的布局方法（如Flexbox和Grid），但理解浮动仍然是很有价值的，因为它在许多现有网站和应用程序中仍然被使用。
CSS实现图片裁剪居中（只截取剪裁图片中间部分，图片不变形）
weixin_48596030的博客
07-05 303
CSS实现图片裁剪居中（只截取剪裁图片中间部分，图片不变形）
前端项目中如何兼容IE8
05-26
兼容IE8的前端开发需要注意以下几点： 1. DOCTYPE声明：要使用HTML5的文档类型声明，但需要加上X-UA-Compatible元标签指定IE8的文档模式。 ``` <!DOCTYPE html> <html> <head> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> </head> <body> ... </body> </html> ``` 2. CSS的兼容处理：建议使用CSS3的语法，但需要注意CSS3新增的属性和选择器在IE8中不支持，需要进行兼容处理。 ``` /* IE8中不支持的CSS3属性 */ .box { border-radius: 10px; box-shadow: 0px 0px 10px #000000; background: linear-gradient(to bottom, #ffffff, #cccccc); } /* 对IE8进行兼容处理 */ .box { border: 1px solid #999999; width: 200px; height: 200px; background-color: #ffffff; /* 针对IE8使用filter属性实现圆角和阴影效果 */ filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false, opacity=0) progid:DXImageTransform.Microsoft.Alpha(enabled=true, opacity=100, finishOpacity=100, style=2, startx=0, starty=0, finishx=0, finishy=100, GradientType=0) progid:DXImageTransform.Microsoft.Shadow(direction=135, strength=5, color=#000000); /* 针对IE8使用渐变背景 */ background: #ffffff; background: -ms-linear-gradient(top, #ffffff, #cccccc); background: linear-gradient(to bottom, #ffffff, #cccccc); } ``` 3. JavaScript的兼容处理：IE8不支持ES5及以上版本的JavaScript语法和API，需要进行兼容处理。 ``` /* IE8中不支持的ES5语法 */ var arr = [1, 2, 3]; arr.forEach(function(item) { console.log(item); }); /* 对IE8进行兼容处理 */ var arr = [1, 2, 3]; for (var i = 0; i < arr.length; i++) { console.log(arr[i]); } ``` 总之，兼容IE8需要对HTML、CSS、JavaScript三个方面进行适当的兼容处理，才能保证在IE8下正常显示和运行。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值