`
techiewang
  • 浏览: 25583 次
  • 性别: Icon_minigender_1
  • 来自: 杭州
社区版块
存档分类
最新评论

图片变灰的css,能兼容各种浏览器的写法。

阅读更多
img.grayscale {
    filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale"); /* Firefox 3.5+ */
    filter: gray; /* IE6-9 */
    -webkit-filter: grayscale(100%); /* Chrome 19+ & Safari 6+ */
}
分享到:
评论

相关推荐

    css浏览器兼容写法

    本文将详细介绍如何编写针对不同浏览器的CSS兼容写法。 首先,我们可以使用特定的CSS选择器来让特定浏览器识别某些样式。例如,对于IE6,我们使用`*html .head{color:#000;}`,其中星号(*)前缀的选择器只有IE6会...

    css和js的浏览器兼容问题汇总

    总的来说,解决CSS和JavaScript的浏览器兼容问题需要开发者对各种浏览器的特性有深入理解,并善于运用工具和技巧进行调试和优化。如使用Firebug、Web Developer、DebugBar等开发工具可以帮助开发者快速定位和解决...

    各浏览器css兼容写法

    以下是一些关于CSS兼容性的关键知识点: 1. **浏览器内核与前缀**: - 不同浏览器使用不同的内核,例如:Chrome和Safari使用WebKit,Firefox使用Gecko,Edge和旧版IE使用Trident。这些内核对CSS新特性的支持程度...

    兼容所有浏览器的样式写法

    #### 二、CSS兼容性解决方案 为了确保网站能够兼容所有浏览器,开发者可以采取以下策略: ##### 1. 使用条件注释 条件注释是一种特殊的HTML注释形式,只能被Internet Explorer浏览器识别并执行。这使得开发者可以...

    兼容各浏览器css渐变

    需要注意的是,在实际开发中,为了更好地兼容性,通常会结合使用多种写法,比如同时使用标准的CSS3语法以及特定浏览器的前缀语法。此外,还可以考虑使用一些工具(如Autoprefixer)自动添加浏览器前缀,以简化开发...

    CSS种针对浏览器兼容问题的解决方法

    本文将详细介绍如何解决这些兼容性问题,帮助开发者确保网站在各种浏览器下都能呈现出一致的效果。 #### 1. 使用条件注释和特定浏览器的选择器 在CSS中,可以通过使用特定于浏览器的选择器来解决兼容性问题。例如...

    CSS浏览器的兼容问题

    随着Web技术的发展,前端开发变得越来越复杂,特别是CSS的跨浏览器兼容性问题一直是开发者们头疼的问题之一。不同的浏览器对CSS的支持程度不同,导致同样的一段CSS代码在不同的浏览器下可能会呈现出完全不同的效果。...

    兼容各种浏览器篡位的css样式写法分享

    综上所述,为了解决兼容各种浏览器的问题,需要掌握多种CSS技巧和写法。虽然随着浏览器的更新换代,这类兼容性写法的需求有所减少,但是了解这些历史技巧对于维护老旧系统和网页仍然具有重要的意义。此外,通过理解...

    CSS Hack 浏览器兼容写法 用法

    CSS Hack 不得不在一些项目中运用到

    CSS中几种浏览器对不同版本的支持与区分写法

    ### CSS中几种浏览器对不同版本的支持与区分写法 在Web开发中,为了确保网站能够在不同的浏览器和浏览器版本上正常显示,开发者需要了解并掌握如何针对不同浏览器编写兼容性良好的CSS代码。本文将详细介绍几种常见...

    css 多浏览器兼容解决方案 下载

    CSS 多浏览器兼容性是Web开发中的重要环节,因为不同的浏览器对CSS的解析方式可能存在差异,这可能导致在不同浏览器中页面展示效果不一致。以下是一些关键知识点和解决方案: 1. **DOCTYPE影响CSS处理**: DOCTYPE...

    浏览器兼容.doc-CSS hack姐姐兼容性问题

    浏览器兼容性问题一直是Web开发中的一个关键挑战,尤其是在CSS样式表现方面。由于不同的浏览器使用了不同的渲染引擎(或称为内核...通过合理使用CSS Hack和遵循最佳实践,可以创建出在各种浏览器中都能良好展示的网页。

    div+css布局时的浏览器兼容问题

    ### div+css布局时的浏览器兼容问题 在Web开发领域,使用div+css进行页面布局是一种常见的技术手段。然而,在实际应用过程中,由于不同浏览器(如IE、Firefox、Chrome等)对CSS的支持程度存在差异,导致同一份CSS...

    解决CSS浏览器兼容性问题的4种方案

    在编写CSS时,我们需要按照浏览器优先级从低到高添加这些前缀,并在最后加上无前缀的标准写法,确保最大范围的浏览器兼容性。 第三,**CSS Hack**是一种直接针对特定浏览器或其版本编写特定CSS代码的方法。例如,...

    获取css样式 兼容写法

    在前端开发中,获取CSS样式是一项基础且重要的任务,它涉及到浏览器兼容性和各种不同方法的运用。本篇文章将深入探讨如何在不同的环境下有效地获取CSS样式,确保代码在各种浏览器上都能正常工作。 首先,让我们从...

    css实现兼容各个浏览器的技巧的代码

    为了确保网页能够在各种浏览器中保持一致的表现,开发者们需要掌握一系列CSS兼容性技巧。本文将详细介绍一些常见的CSS兼容性问题及其解决方案。 #### 1. 盒模型的兼容性处理 由于不同的浏览器对于盒模型的解析方式...

    H5 CSS hack 和浏览器内核

    总的来说,H5 CSS Hack是解决浏览器兼容性问题的重要手段,通过理解和灵活运用各种Hack方法,可以确保网页在不同浏览器上呈现出一致的视觉效果。随着浏览器对新标准支持的逐步完善,虽然CSS Hack的重要性正在减弱,...

    CSS浏览器兼容和IE中bug问题

    这种写法能够确保在各个浏览器中都能得到正确的宽度显示。 2. **IE6中的`float: right`问题** - **问题描述**:在IE6中,当一个元素设置`float: right`时,可能会导致该元素的位置出现偏差。 - **解决方案**:...

    css3使网页、图片变成灰色兼容大多数浏览器

    在现代网页设计中,CSS3已经成为了不可或缺的一部分,它提供了许多强大的功能,其中之一就是能够将网页...在实际开发中,结合各种浏览器的前缀和特定于IE的滤镜,我们可以确保这个功能在大部分用户环境中都能正常工作。

Global site tag (gtag.js) - Google Analytics