首页 > 其他分享 >兼容IE6和Firefox的PNG背景透明CSS…

兼容IE6和Firefox的PNG背景透明CSS…

时间:2022-12-26 15:37:30浏览次数:65  
标签:www http IE6 lanrentuku Firefox com CSS


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "​​http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd​​​">
<html xmlns="​​​http://www.w3.org/1999/xhtml​​​">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>兼容IE6和Firefox的PNG背景透明CSS代码-懒人图库</title>
<style type="text/css">
<!--
.lanrentuku {
background-image:url(​​​http://www.lanrentuku.com/down/js/images/12593184560.png)!important;background-image:url(www.lanrentuku.com​​​);
FILTER: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='http://www.lanrentuku.com/down/js/images/12593184560.png');
WIDTH: 225px;height:38px;}
-->
</style>
</head>

<body>
<div class="lanrentuku"></div>

<p><strong>兼容IE6和Firefox的PNG背景透明CSS代码</strong></p>
<p>PNG的背景透明在网页中应用比较广泛,但浏览器的兼容问题一直很让人头疼,这个<a href="​​​http://www.lanrentuku.com/js/jiaodiantu-710.html​​​" target="_blank">JS焦点图代码</a>,是用JS判断的方法,西西用CSS变通的也实现了PNG背景透明的兼容问题。</p>
<p>说明:</p>
<p>1、当CSS中出现两个同样的属性,无论是否有!important,IE6只识别最后一个属性。(IE6是识别!important的,后面的background-image起干扰作用,呵呵~)</p>
<p>2、在Firefox下,!important被优先执行,FILTER滤镜不起作用。</p>
<p>作者:<a href="​​​http://www.lanrentuku.com​​​" target="_blank">西西</a>(尊重他人劳动成果,转载请自觉注明出处!)</p>
<p>查找更多代码,请访问:<a href="​​​http://www.lanrentuku.com​​​" target="_blank">懒人图库</a></p>
</body>
</html>

标签:www,http,IE6,lanrentuku,Firefox,com,CSS
From: https://blog.51cto.com/haibo0668/5969105

相关文章

  • 用UL标签+CSS实现的柱状图
    <!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""​​http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd​​​"><htmlxmlns="​​​http://ww......
  • CSS & JS Effect – Tooltip
    介绍Tooltip长这样它用popup的方式来详细描述一个主体.比如某个icon代表着什么. 参考YouTube– HowToMakeTooltipsWithOnlyCSS 思路和难点1.ho......
  • 用css写一个奥运五环
    title:用css写一个奥运五环description:用css写一个奥运五环tags:-cssdate:2022-12-2314:00目录效果代码效果代码<!DOCTYPEhtml><htmllang="en"><hea......
  • 如何优雅的写 css 代码
    CSS(全称CascadingStyleSheets,层叠样式表)为开发人员提供声明式的样式语言,是前端必备的技能之一,基于互联网上全面的资料和简单易懂的语法,CSS非常易于学习,但其知识点广泛且......
  • CSS画一个三角形
    前言在前端开发的时候,我们有时候会需要用到一个三角形的形状,比如地址选择或者播放器里面播放按钮。通常情况下,我们会使用图片或者svg去完成三角形效果图,但如果单纯使用css......
  • 8款web设计的CSS 工具
    当涉及到简化 css 设计和开发相关的工作时,工具总能创造奇迹。值得指出的是,绝大多数的网页设计者和开发人员对不同的 css 工具都感到兴奋,这些工具能帮助他们更快的制作功......
  • CSS Flex 布局的 flex-direction 属性讲解
    flex-direction设置了主轴,从而定义了弹性项目放置在弹性容器中的方向。Flexbox是一种单向布局概念,可将弹性项目视为主要以水平行或垂直列布局。.container{flex-d......
  • CSS Flex 布局的引入背景
    Flexbox布局(FlexibleBox)模块(截至2017年10月的W3C候选推荐)旨在提供一种更有效的方式来布局、对齐和分配容器中item元素之间的空间,即使它们的大小未知和/或动态,这......
  • 8种纯CSS实现的炫酷HOVER效果,你应该在网站中尝试使用
    英文| https://www.blog.duomly.com/html-button-hover-effects/作者| AnnaDanilec翻译|web前端开发按钮悬停效果简介​按钮是每个页面,Web应用程序或移动应用程序中......
  • 【开发小技巧】031—用CSS3如何实现钟摆动画的导航栏菜单效果
    编辑|web前端开发(web_qdkf)我们都知道,CSS3可以实现很多很酷的动画效果,而今天我们将与大家分享一期用CSS3制作的钟摆动画菜单效果,在这个动画中,我们主要采用CSS3来控制SVG图......