哀悼的CSS（网站变灰）（雅安加油）

最新推荐文章于 2021-06-09 17:17:10 发布

最新推荐文章于 2021-06-09 17:17:10 发布 · 119 阅读

文章标签：

#filter

HTML/CSS 专栏收录该内容

1 篇文章

订阅专栏

本文介绍了一个简单的网页布局，并使用了CSS过滤器来为整个页面应用灰度效果。这种效果通常用于纪念或哀悼目的。示例中展示了如何在HTML中插入图片，并通过内联样式设置灰度。

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>雅安加油！</title>
<style>
html {
        -webkit-filter: grayscale(100%);<!--通过测试grayscale(1)跟grayscale(100%)特效是一样的-->
        -moz-filter: grayscale(100%);
        -ms-filter: grayscale(100%);
        -o-filter: grayscale(100%);
        filter:progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);
        _filter:none;
    }
</style>

</head>
<body>

<table>
	<tr>
		<td><img src="2013-04-21_155930.jpg"/></td>
	</tr>
</table>
</body>
</html>

之前