简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW) 日本語(JA) 한국어(KO) Melayu(MS) Français(FR) Deutsch(DE)
css - 天津爆炸，百度搜索结果页面变灰色，filter grayscale 到底怎么个兼容？
天蓬老师
天蓬老师 2017-04-17 11:44:01
0
3
512

百度页面如下：

https://www.baidu.com/s?cl=3&tn=baidutop10&fr=top1000&wd=%E5%A4%A9%E6%B4%A5%E7%88%86%E7%82%B8%E8%87%B4112%E6%AD%BB&rsv_idx=2

变为灰色了，IE8及以下还是彩色，未起作用。

有没有熟悉filter属性的大神，给详细介绍下它的兼容性及使用注意事项，我看grayscale(100%)还有grayscale(1)。

天蓬老师
天蓬老师

欢迎选择我的课程，让我们一起见证您的进步~~

全員に返信(3)
左手右手慢动作
左手右手慢动作2017-04-17 11:46:01 3棟 
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>赴汤蹈火英雄壮举照日月，舍生忘死烈士忠魂耀乾坤。</title>
<style>
html {
	filter: grayscale(1);
	-webkit-filter: grayscale(1);
	filter: progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);
}
</style>
</head>
<body>
	<h1>赴汤蹈火英雄壮举照日月，舍生忘死烈士忠魂耀乾坤。</h1>
	<img src="http://i.guancha.cn/news/2015/08/16/20150816185340908.jpg">
</body>
</html>

上面的代码，Firefox、Chrome、IE8/IE7都能实现页面变灰以表示哀悼。

いいねを押す +0
返信を追加
巴扎黑
巴扎黑2017-04-17 11:46:01 2棟

谢谢 @eechen eechen ,IE 确实特殊；

我看filter后面还可以跟很多种其他特效：filter 是css3新属性吗，还是IE 很早之前就有了这个属性了，

blur()
brightness()
contrast()
drop-shadow()
grayscale()
hue-rotate()
invert()
opacity()
saturate()
sepia()
url() 
custom()
いいねを押す +0
返信を追加
阿神
阿神2017-04-17 11:46:01 1棟

推荐你这篇文章

いいねを押す +0
返信を追加
人気のトピック
詳細>
人気の記事
人気のチュートリアル
詳細>
関連するチュートリアル
人気のおすすめ
最新のコース
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート
私たちについて 免責事項 Sitemap
PHP中国語ウェブサイト：福祉オンライン PHP トレーニング，PHP 学習者の迅速な成長を支援します！