In diesem Artikel erfahren Sie, wie Sie mit CSS3 Bilder in den Graumodus umwandeln. Die Implementierung ist sehr einfach und Freunde in Not können darauf zurückgreifen.
Beispielcode:
Der Code lautet wie folgt:
<!DOCTYPE html>
<html>
<head>
<meta charset="{CHARSET}">
<title></title>
<style type="text/css">
.gray {
-webkit-filter: grayscale(100%);
-moz-filter: grayscale(100%);
-ms-filter: grayscale(100%);
-o-filter: grayscale(100%);
filter: grayscale(100%);
filter: gray;
}
img{width:400px;}
</style>
</head>
<body>
<img class="gray" src="<a href="http://b.hiphotos.baidu.com/zhidao/pic/item/1c950a7b02087bf4fbb05256f0d3572c11dfcf35.jpg">http://www.php.cn/;/a>">
<img class="gray" src="<a href="http://c.hiphotos.baidu.com/zhidao/pic/item/03087bf40ad162d9e0c359f214dfa9ec8a13cd2a.jpg">http://www.php.cn/;/a>" />
<img src="<a href="http://b.hiphotos.baidu.com/zhidao/pic/item/1c950a7b02087bf4fbb05256f0d3572c11dfcf35.jpg">http://www.php.cn/;/a>">
<img src="<a href="http://c.hiphotos.baidu.com/zhidao/pic/item/03087bf40ad162d9e0c359f214dfa9ec8a13cd2a.jpg">http://www.php.cn/;/a>" c/>
</body>
</html>Zusammenfassung
Das ist alles dafür Ich hoffe, dass Ihnen der Inhalt gefällt. Vielen Dank für Ihre Unterstützung der chinesischen PHP-Website.
Weitere verwandte Artikel zu Beispielen dafür, wie CSS3 Bilder in den Graumodus umwandelt, finden Sie auf der chinesischen PHP-Website!
CSS3-Tutorial
So ändern Sie den Text im Bild
Was tun, wenn das eingebettete Bild nicht vollständig angezeigt wird?
Was sind die CSS3-Gradienteneigenschaften?
So lassen Sie PPT-Bilder einzeln erscheinen
So erstellen Sie ein rundes Bild in ppt
Ethereum-Preisangebote
So passen Sie die Mausempfindlichkeit an
![[Web-Frontend] Node.js-Schnellstart](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
