Maison >interface Web >tutoriel CSS >Comment transformer une page Web entière en noir et blanc ?

Comment transformer une page Web entière en noir et blanc ?

yulia
yuliaoriginal
2018-09-20 11:38:5710589parcourir

Cet article explique comment transformer l'intégralité d'une page Web en noir et blanc ou en noir, et quelles méthodes peuvent être utilisées. Si cela vous intéresse, vous pouvez vous y référer, j'espère qu'il vous sera utile.

Code CSS complet du site.

html { filter:progid:DXImageTransform.Microsoft.BasicImage(grayscale=1); }

Comment utiliser : Ce code peut changer la page Web en noir et blanc. Ajoutez le code en haut du CSS pour obtenir une décoration simple. Il est recommandé aux webmasters de tout le pays d’agir. Condoléances aux compatriotes décédés dans le tremblement de terre.

Si le site Web n'utilise pas CSS, vous pouvez insérer entre le code HTML 93f0f5c25f18dab9d176bd4f6de5d30e et 9c3bca370b5104690d9ef395f2c5f8d1 de la page Web/du modèle :

<style>
html{filter:progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);}
</style>

Certains webmasters peuvent L'utilisation de ce CSS ne peut pas prendre effet car le site Web n'utilise pas le dernier protocole standard du Web

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

Veuillez remplacer le 100db36a723c770d327fc0aef2ce13b1 en haut de la page Web par le code ci-dessus.

Il existe certains sites Web sur lesquels la couleur de l'animation FLASH ne peut pas être contrôlée par les filtres CSS. Vous pouvez l'insérer entre c0344c6ab64b40438518a590d0ce08e6 et eb50c9ec568c9b96871b9e94a1ff3fd1 dans le code FLASH :

<param value="false" name="menu"/>
<param value="opaque" name="wmode"/>

Le code le plus simple pour rendre la page grise est d'ajouter

<style type="text/css">
html {
    FILTER: gray
}
</style>

entre les en-têtes Généralement, dans le forum discuz, modifiez-le sous votre contrôle fichier css

/. images/header/header.css fichier,

méthode CSS

utilise le plug-in du logiciel Firefox (installer Firebug) ie7 ou IE 8 doit avoir des outils de développement ( appuyez sur F12 pour apparaître)

Tout le monde sait que dans le navigateur IE, vous pouvez utiliser un morceau de corps de code {filter: gray;} pour utiliser le code de filtre de Microsoft pour décolorer l'ensemble du site Web dans un ton gris noir et blanc effet, mais il n'est pas compatible avec d'autres navigateurs non Firefox tels que Firefox Internet Explorer.

Ton gris du site Web CSS (supporte uniquement IE)

Style en ligne :

elem.style.filter = 'progid:DXImageTransform.Microsoft.BasicImage(grayscale=1)' ;

feuille de style CSS :

elem { filter: progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);

                                       /* L'élément doit "hasLayout" */

Zoom : 1;>

Comme Firefox ne prend pas en charge les filtres, j'ai utilisé hier les chaussures pour enfants de Firefox et j'ai constaté que de nombreux sites Web (Renren, 19e étage) étaient toujours en couleur.

Cela implique des problèmes de compatibilité du navigateur, des hacks CSS, etc.

Hier, j'ai juste utilisé IE ou le firebug de Firefox pour décocher la case devant le corps {filter: gray;}, ou mettre elem.style.filter = 'progid:DXImageTransform.Microsoft.BasicImage(grayscale=1 )' ; Décochez cette phrase pour la voir en couleur

Quant à savoir comment transformer Flash en gris et comment rendre un site Web en noir et blanc compatible avec différents navigateurs, je publierai simplement le code. Ayant écrit cela de cette façon, je n'entrerai pas dans les détails. Les amis intéressés peuvent rechercher des réponses en ligne.

Grisage de FLASH :

La couleur de l'animation FLASH sur certains sites Web ne peut pas être contrôlée par des filtres CSS, ce qui peut être fait dans le e33c36f65310ca8037193530b54a2a89 :

e20eab0f894f00d62d8e790461aebf83

3a1af799c505051f284042441e0d47d5

JavaScript

Utiliser :

// Méthode 1 var el = document.getElementById( 'myEl' ) ;grayscale( el ); // Méthode deux grayscale( document.getElementsByTagName('div') ); // Utilisé dans jquery : grayscale( $('div') ); 🎜>grayscale.reset ( el ); // De même, la méthode de réinitialisation peut également être utilisée jquerygrayscale.reset( $('div') );

Prétraitement :

grayscale.prepare( document.getElementById(' myEl') );// grayscale.prepare( $('.gall_img') );

peut également être utilisé dans jquery

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn