Verschiedene Methoden zum Ändern des CSS-Stils, um graue Webseiten zu erhalten (keine Farbe, nur helles Schwarzweiß)
|
Normalerweise färben wir als Webmaster während des Qingming-Festes, des Nationalen Trauertags, des Tages eines schweren Erdbebens und des Todestages oder Todestags einiger einflussreicher Persönlichkeiten alle Seiten unserer Website grau (schwarz-weiß), um den Verstorbenen unser Beileid auszusprechen. Lassen Sie uns heute darüber sprechen, wie diese Funktion mit ein paar einfachen Codezeilen implementiert werden kann. Heute Morgen erwähnte ein Internetnutzer, dass er den Gesamtfarbton der Website in Grau und Schwarz ändern möchte. Ich erinnere mich, dass dies in der Vergangenheit verwendet wurde, um an bestimmte Daten zu erinnern, und es wurde auch auf der Website 123WORDPRESS.COM verwendet. Ich erinnere mich, dass dies damals direkt durch Ändern von CSS erreicht werden konnte. Da es Benutzer gibt, die dies benötigen, werde ich mir etwas Zeit nehmen, um es zu klären und zu prüfen, ob es andere, bessere Methoden gibt. Wir können den geeigneten CSS-Codestil entsprechend den tatsächlichen Anforderungen auswählen und ihn dem Code unserer eigenen Webseitenvorlage hinzufügen, um Grau-, Schwarz- und Weißstile der Webseite zu erzielen. Erstens, Webseite schwarz und weiß Code Stil A: Ändern Sie die CSS-Datei Wir können den folgenden CSS-Code zur CSS-Datei der Webseite hinzufügen, um die Webseite schwarzweiß zu machen, d. h. die Website grau CSS Code Webseite schwarz-weiß Code Stil A
html {
Filter: Progid:DXImageTransform.Microsoft.BasicImage(Graustufen=1);
-Webkit-Filter: Graustufen (100 %);
}Diese Code-Webseite im Schwarzweiß-Codestil B wird ebenfalls empfohlen
<Stil>
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;
}
</Stil>Hier können wir den Code zur HEAD-Vorlage hinzufügen, um die gesamte Site zu erreichen. Zweite Methode: Fügen Sie den folgenden Code zum <head>-Tag der Webseite hinzu Wenn Sie die CSS-Datei nicht ändern möchten, können Sie die Seiten der Website ausgrauen, indem Sie Inline-CSS-Code innerhalb des <head>-Tags in der Kopfzeile der Webseite hinzufügen. Code
<style type="text/css">
html {
Filter: Progid:DXImageTransform.Microsoft.BasicImage(Graustufen=1);
-webkit-filter: Graustufen (100 %);}
</Stil>Die dritte Methode: Ändern Sie das <html>-Tag, um Inline-Stile hinzuzufügen Wenn Ihnen die beiden oben genannten Methoden nicht gefallen, können Sie das <html>-Tag ändern, um Inline-Stile hinzuzufügen und so den Effekt einer Ausgrauung der Webseite zu erzielen. Code
Viertens: Vom Autor selbst verwendeter CSS-Code Code:
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- */
}
Hier können wir den Code nach tatsächlichem Bedarf ergänzen. PS: Die oben genannten Methoden steuern alle die Anzeige der Seite über CSS-Filter. Der einzige Unterschied besteht in der Art und Weise, wie der CSS-Code aufgerufen wird. Leute, gräbt aus, was euch gefällt! |
<<: Vue implementiert horizontales Scrollen von Text im Laufschriftstil
>>: MariaDB-Serverinstallation der MySQL-Reihe
Artikel empfehlen
Methoden zum Defragmentieren und Freigeben von Speicherplatz in MySQL-Tabellen
Inhaltsverzeichnis Ursachen der MySQL-Tabellenfra...
Zusammenfassung der Probleme beim Hinzufügen, Löschen, Ändern und Abfragen von MySQL-Tabellen, -Spalten und -Datenbanken
Im Folgenden habe ich einige grundlegende SQL-Ken...
URL-Rewrite-Modul 2.1 URL-Rewrite-Modul – Regeln schreiben
Inhaltsverzeichnis Voraussetzungen Einrichten ein...
Lösung für den Fehler beim Importieren von MySQL Big Data in Navicat
Die von Navicat exportierten Daten können nicht i...
Eine kurze Analyse von Kubernetes-Controllern und -Labels
Inhaltsverzeichnis 01 Gemeinsame Controller in k8...
So ändern Sie die Portzuordnung eines laufenden Docker-Containers
Vorwort Wenn Docker Run einen Container erstellt ...
Beispielcode zur Implementierung von Dreiecken und Pfeilen durch CSS-Rahmen
1. CSS-Boxmodell Die Box beinhaltet: Rand, Rahmen...
Bedingtes Rendering von Vue (v-if und v-show)
Inhaltsverzeichnis 1. v-wenn 2. Verwenden Sie v-i...
Analyse des Implementierungsprozesses der Docker-Container-Orchestrierung
In tatsächlichen Entwicklungs- oder Produktionsum...
Vue2.x - Beispiel für die Verwendung von Anti-Shake und Throttling
Inhaltsverzeichnis Dienstprogramme: Verwendung in...
So erben Sie die CSS-Zeilenhöhe
Wie wird die Zeilenhöhe vererbt?Schreiben Sie ein...
Ein kurzer Vortrag über den Diff-Algorithmus in Vue
Inhaltsverzeichnis Überblick Virtueller Dom Prinz...
Holen Sie sich die IP und den Hostnamen aller Hosts auf Zabbix
zabbix Zabbix ([`zæbiks]) ist eine Open-Source-Lö...
CentOS 8 Installationshandbuch für Zabbix 4.4
Zabbix-Serverumgebungsplattform ZABBIX Version 4....
Detaillierte Erläuterung des Beispiels einer MySQL-Einzeltabellenabfrage
1. Daten vorbereiten Die folgenden Operationen we...