Maison >interface Web >tutoriel CSS >Code d'implémentation de l'effet de masque d'image de survol de la souris CSS

Code d'implémentation de l'effet de masque d'image de survol de la souris CSS

小云云
小云云original
2018-02-28 10:19:003260parcourir

Cet article partage principalement avec vous le code d'implémentation de l'effet de masque d'image de survol de la souris CSS, dans l'espoir d'aider tout le monde.

css

p>p{    background: rgba(255, 255, 255, 0);    transition: background 0.3s linear;}p:hover>p{    background: rgba(228, 228, 228, 0.29);}

html

<p style="width:200px;height:200px;position: absolute;">
    <img src="img/img.jpg" style="width: 100%;height: 100%;"/>
    <p style="position: absolute;width: 100%;height: 100%;top: 0;"></p></p>

Recommandations associées :

javascript survol de l'image afficher l'image originale déplacer la souris out Ensuite, l'image originale disparaît (plusieurs images)_Effets spéciaux d'image

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