Comment rendre les pages d'un site Web grises avec CSS-tutoriel CSS-php.cn

Comment rendre les pages d'un site Web grises avec CSS

小云云

Libérer： 2018-12-13 10:26:13

original

5147 Les gens l'ont consulté

Cet article vous présente principalement les informations pertinentes sur l'utilisation de CSS pour griser les pages d'un site Web. L'article fournit un exemple de code détaillé pour votre référence et votre étude. Il a une certaine valeur de référence et d'apprentissage pour tout le monde. est nécessaire Mes amis, jetons un œil ci-dessous, j'espère que cela pourra aider tout le monde.

Comment rendre les pages d'un site Web grises avec CSS

Pour obtenir l'effet gris dans l'image ci-dessus, la méthode est la suivante :

Ce code CSS peut changer la page Web en noir et blanc. Ajouter le code en haut du CSS Plain dressing est possible.

html{
filter: grayscale(100%);
-webkit-filter: grayscale(100%);
-moz-filter: grayscale(100%);
-ms-filter: grayscale(100%);
-o-filter: grayscale(100%);
filter:progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);
}

Copier après la connexion

S'il n'y a pas de balise HTML dans votre page, pensez à l'ajouter. Vous pouvez ajouter la balise HTML5 suivante, ou changer le html de la balise CSS ci-dessus en body ou autre.

<!DOCTYPE html>
<html>
</html>

Copier après la connexion

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 >

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

Copier après la connexion

Si certaines pages avec Flash affichent toujours des couleurs, ou si le lecteur Flash FLV change lorsque la barre de défilement du navigateur est déplacée de haut en bas (comme Jianwang 3, page de détournement du site officiel de Jianxia World), remplacez Flash par JS. sortie (Cet exemple est SWFObject) :

<script type="text/javascript" src="/js/swf.js"></script>
<p id="video_content"></p>
<script type="text/javascript">
<!--
var video_player_so = new SWFObject("video-542.swf", "sotester", "439", "246", "7");
video_player_so.addParam("wmode", "opaque");
video_player_so.addParam("allowfullscreen","true");
video_player_so.addParam("allowscriptaccess","always");
video_player_so.write("video_content");
//-->
</script>

Copier après la connexion

L'avez-vous appris ? Dépêchez-vous et essayez-le.

Recommandations associées :

Comment utiliser CSS pour rendre les images semi-transparentes

Comment utiliser les unités de fenêtre pour la mise en page en CSS3

À propos du centrage des éléments flottants CSS

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!