Comment utiliser CSS pour rendre les images translucides-tutoriel HTML-php.cn

Comment utiliser CSS pour rendre les images translucides

php中世界最好的语言

Libérer： 2017-12-16 11:09:52

original

2978 Les gens l'ont consulté

Le code que je vous ai apporté aujourd'hui explique comment utiliser CSS pour que l' image obtienne un effet translucide.

 <style type="text/css">
<!--
.alpha img{ filter: Alpha(Opacity=30, FinishOpacity=0, Style=1, StartX=0, StartY=0, FinishX=100, FinishY=100)}
-->
</style>

Copier après la connexion

Code html complet :

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>图片半透明效果</title>
<style type="text/css">
</style>
</head>
<body>
<div class="alpha"><img src="http://www.php.cn/img/1.gif" width="180" /><br />
以上是CSS处理后效果<br />
<br />
</div>
<div><img src="http://www.www.php.cn/img/1.gif" width="180" /><br />
以上是处理前效果</div>
</body>
</html>

Copier après la connexion

Le code de l'effet de filtre CSS utilisé : filter: Alpha(Opacity=30, FinishOpacity=0, Style= 1, StartX= 0, StartY=0, FinishX=100, FinishY=100) Modifiez les chiffres à l'intérieur pour ajuster la transparence et l'effet

Veuillez noter que cet effet de filtre CSS ne peut pas être implémenté dans Firefox ou Google Chrome ou ce n'est pas le cas. fonctionnent, nous recommandons donc généralement de ne pas utiliser de filtres CSS. Les filtres CSS occuperont trop de mémoire informatique et rendront la navigation sur le Web difficile, vous pouvez donc les utiliser de manière appropriée.

Je pense que vous maîtrisez les méthodes après avoir lu ces cas. Pour des informations plus intéressantes, veuillez prêter attention aux autres articles connexes sur le site Web chinois de php !

Lecture connexe :

Réponses aux questions sur la dénomination des cas de chameaux et JS

Valeurs booléennes, opérateurs relationnels en JS, Explication détaillée et exemples d'opérateurs logiques

Résumé du framework front-end js et explication de ses utilisations

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!