Maison  >  Article  >  interface Web  >  Comment masquer les éléments CSS

Comment masquer les éléments CSS

coldplay.xixi
coldplay.xixioriginal
2021-04-16 16:05:204490parcourir

Comment masquer les éléments CSS : 1. L'attribut opacité signifie définir la transparence d'un élément ; 2. La visibilité définit sa valeur sur caché pour masquer nos éléments ; 3. L'attribut d'affichage masque réellement l'élément en fonction ; le sens du mot.

Comment masquer les éléments CSS

L'environnement d'exploitation de ce tutoriel : système Windows 7, version CSS3, ordinateur DELL G3.

Comment masquer les éléments CSS :

1. Opacité

L'attribut opacité signifie définir la transparence d'un élément. . Il n’est pas conçu pour modifier le cadre de délimitation d’un élément. Cela signifie que définir l'opacité sur 0 masque uniquement visuellement l'élément. L'élément lui-même occupe toujours sa propre position et contribue à la mise en page de la page Web.

Code CSS :

.hide {
  opacity: 0;
}

2. Visibilité

Définir sa valeur sur caché masquera notre élément. Comme l'attribut opacité, les éléments masqués auront toujours un effet sur la mise en page de notre page Web.

.hide {
   visibility: hidden;
}

3. Display

L'attribut display masque véritablement l'élément selon le sens du mot. La définition de la propriété display sur none garantit que l'élément n'est pas visible et que même le modèle de boîte n'est pas généré. Grâce à cet attribut, les éléments masqués n'occupent aucun espace.

.hide {
   display: none;
}

Recommandations de tutoriel associées : Tutoriel vidéo 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!

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
Article précédent:Comment masquer le texte CSSArticle suivant:Comment masquer le texte CSS