Beispiel für die Umwandlung eines Bildes in den Graumodus mithilfe von CSS3-CSS-Tutorial-php.cn

Beispiel für die Umwandlung eines Bildes in den Graumodus mithilfe von CSS3

高洛峰

Freigeben： 2017-03-02 15:41:41

Original

1999 Leute haben es durchsucht

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>

Nach dem Login kopieren

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!