Ajouter un masque à la fenêtre contextuelle de votre page Web

Cet article vous présente l'utilisation du CSS pour obtenir des effets de masquage de pages Web. Il obtient principalement l'effet de masquage en contrôlant le niveau d'affichage des deux cases, en contrôlant la couleur d'arrière-plan et la transparence d'affichage du calque de masque. J'espère que cela sera utile aux amis qui apprennent le CSS.

Ajoutez un masque à votre fenêtre pop-up

Je crois que l'effet de calque de masque est souvent rencontré dans de nombreux besoins de développement Il existe de nombreuses façons d'obtenir l'effet de calque de masque. La plus simple est présentée ci-dessous, en utilisant CSS pour implémenter le masque

code du nœud dom :

<!-- 进度条遮罩 -->
<t:p id="shade" styleClass="shade" > </t:p>

Code de style CSS

.ui-progressbar{
                position: absolute;
                top:40%;
                left:40%;
                z-index: 99999999;
                width:500px;
                height:22px;
                line-height:22px;
                display:none;
            }
            .ui-progressbar-value 
            { 
                    background-image: url("../images/pbar-ani.gif"); 
                border:0px;
            }
            .shade
            {
               background:rgba(0, 0, 0, 0.4);
               width:100%;
               height:100%;
               position: absolute;
               z-index:99;
               left:0px;
               top:0px;
               opacity:0.6;
               filter:alpha(opacity=60);
               display:none; 
            }

Permet principalement d'obtenir l'effet de masquage en contrôlant les niveaux d'affichage des deux cases, en contrôlant la couleur d'arrière-plan et la transparence d'affichage du calque de masque.

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!