Die Website ist ausgegraut. Kompatibler Code einschließlich Bilder unterstützt alle Browser

Die Website ist ausgegraut. Kompatibler Code einschließlich Bilder unterstützt alle Browser

An nationalen Trauertagen, Tagen mit schweren Erdbeben und dem Qingming-Fest färben wir unsere gesamte Website grundsätzlich grau, um den Verstorbenen unser Beileid auszusprechen. Hier sind ein paar Methoden

1. Fügen Sie einfach den Code zum Text hinzu

Es ist sehr einfach, diesen Effekt zu erzielen. Sie benötigen nur einen CSS-Code: Filter: Graustufen (100 %) und fügen ihn im Stil des Body-Elements ein. Die Effekte, die wir selbst erzielt haben:

2. Direkt in der aufgerufenen CSS-Styledatei, so dass keine Änderung des HTML-Codes nötig ist.

Direkt zum Code:

/*Website wird grau*/
html {-webkit-filter: Graustufen (100 %);-moz-filter: Graustufen (100 %);-ms-filter: Graustufen (100 %);-o-filter: Graustufen (100 %);filter:progid:DXImageTransform.Microsoft.BasicImage (Graustufen = 1);_filter: keine;}

Oder laden Sie den Code herunter. Der obige Code wird empfohlen.


Code kopieren
Der Code lautet wie folgt:

html{
-Webkit-Filter: Graustufen (100 %);
-moz-filter: Graustufen (100 %);
-ms-filter: Graustufen (100 %);
-o-Filter: Graustufen (100 %);
Filter: Graustufen (100 %);
Filter: URL ("data:image/svg+xml;utf8, <svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'Graustufen\'><fecolormatrix Typ=\'Matrix\' Werte=\'0,3333 0,3333 0,3333 0 0 0,3333 0,3333 0,3333 0 0 0,3333 0,3333 0 0 0 0 0 1 0\'></fecolormatrix></filter></svg>#Graustufen");
Filter: Progid:DXImageTransform.Microsoft.BasicImage(Graustufen=1);
}

3. Tencents Ansatz:

<Stil>
Körper *{
-webkit-filter: Graustufen (100 %); /* webkit */
-moz-filter: Graustufen (100 %); /*Firefox*/
-ms-filter: Graustufen (100 %); /*ie9*/
-o-filter: Graustufen (100 %); /*Opera*/
Filter: Graustufen (100 %);
Filter:progid:DXImageTransform.Microsoft.BasicImage(Graustufen=1); 
Filter: grau; /*ie9- */
}
</Stil>

Einige andere Methoden:

1. Externer Stil des Schwarzweiß-Codes der Webseite (bitte verwenden Sie zum Schreiben eine *.css-Datei)

html {
Filter: Progid:DXImageTransform.Microsoft.BasicImage(Graustufen=1);
-Webkit-Filter: Graustufen (100 %);
}

2. Interner Stil des Schwarz-Weiß-Codes der Webseite (geschrieben im Head-Tag)

<style type="text/css">
<!--
html {
Filter: Progid:DXImageTransform.Microsoft.BasicImage(Graustufen=1);
-webkit-filter: Graustufen (100 %);}
-->
</Stil>

3. Inline-Schwarzweißcode der Webseite (HTML-Tag schreiben, HTML suchen)

<html style="filter: progid:DXImageTransform.Microsoft.BasicImage(graustufen=1);
-webkit-filter: Graustufen (100%);">

Es ist nur ein Code, der vom Herausgeber von 123WORDPRESS.COM zusammengestellt wurde. Er ist einfach und praktisch, ich hoffe, er kann jedem helfen.

<<:  Tipps zum Deaktivieren des Kompatibilitätsansichtsmodus von IE8 und IE9 mithilfe von HTML

>>:  Vues einfacher Implementierungsprozess zur Nachahmung der NetEase Cloud Music Player-Schnittstelle

Artikel empfehlen

CentOS 7 - Lösungsprozessdiagramm für vergessene Passwörter

brauchen Unabhängig davon, ob es sich um ein Wind...

HTML-Codeanalyse der Textkonvertierungseffekte bei Links- und Rechtsbewegungen

<div ausrichten="zentrieren"> <...

So konfigurieren Sie eine VMware-Umgebung mit mehreren Knoten

Dieses Tutorial verwendet CentOS 7 64-Bit. Weisen...

Zusammenfassung der praktischen Erfahrungen zu HTML-Wissenspunkten

1. Das Tabellen-Tag ist Tabelle, tr ist Zeile, td ...

Detaillierte Erklärung des HTML-Bereichs-Tags

Der <area>-Tag definiert einen Bereich in e...

Detaillierte Erklärung generischer Fälle in TypeScript

Definition von Generika // Anforderung 1: Generik...

Eine kurze Analyse zum besten Umgang mit vergessenen MySQL 8-Passwörtern

Vorwort Leser, die mit MySQL vertraut sind, werde...

MySQL 8.0.17 winx64 (mit Navicat) manuelle Konfiguration Version Installation Tutorial Diagramm

1. Download-Adresse: mysql-8.0.17-winx64 Herunter...

Sublime Text - Empfohlene Methode zum Festlegen von Browser-Tastenkombinationen

Codeeffekte werden häufig in unterschiedlichen Br...

CSS3-Übergang zum Erreichen des unterstrichenen Beispielcodes

In diesem Artikel wird der Beispielcode für den C...

Erstellen Sie eine Bildschirmaufzeichnungsfunktion mit JS

OBS studio ist cool, aber JavaScript ist cooler. ...

HTML-Grundstruktur_Powernode Java Academy

Wenn wir lernen, Webseiten zu entwickeln, ist das...

Zusammenfassung der Anwendungsbereiche von Kubernetes

Kubernetes ist aufgrund seiner Anwendungsportabil...

MySQL Order By-Codebeispiel für Sortierregeln für mehrere Felder

Sag es im Voraus Aus einer Laune heraus möchte ic...

So importieren Sie eine JS-Konfigurationsdatei auf den Vue-Server

Inhaltsverzeichnis Hintergrund erreichen Ergänzun...