Maison  >  Article  >  interface Web  >  Quelles sont les propriétés du CSS pour masquer et afficher des éléments ?

Quelles sont les propriétés du CSS pour masquer et afficher des éléments ?

青灯夜游
青灯夜游original
2021-04-16 17:42:477135parcourir

Les attributs d'implémentation sont : 1. attribut d'affichage, lorsque la valeur est "aucun", l'élément est masqué, et lorsqu'il est "bloc", l'élément est affiché 2. attribut de visibilité, lorsque la valeur ; est "caché", l'élément est masqué et il est "visible" Lors de l'affichage des éléments ; 3. attribut de débordement 4. attribut d'opacité ;

Quelles sont les propriétés du CSS pour masquer et afficher des éléments ?

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

Afficher et masquer des éléments

Essence : Masquer ou afficher un élément sur la page.

css peut réaliser les attributs de masquage et d'affichage d'éléments

1 : attribut d'affichage

  • display: none; Objets cachés

  • display: block;En plus de la conversion en éléments de niveau bloc, cela signifie également afficher des éléments

Remarque : une fois l'affichage masqué, l'élément n'occupe plus la position d'origine

2.attribut de visibilité

  • visibility: visible; L'élément est visible

  • visibility: hidden; Masquage de l'élément

Remarque : Une fois que la visibilité a masqué l'élément, il continuera à occuper sa position d'origine

3 Attribut .overflow (affichage et masquage du contenu de débordement)

overflow: visible | hidden | scroll | auto

1 Voir le tableau ci-dessous pour une description détaillée des valeurs d'attribut :

属性值 说明
visible 不剪切内容,也不添加滚动条
hidden 隐藏超出的部分
scroll 不管内容是否超出,都显示滚动条
auto 只有内容超出时才显示滚动条,不超出则不显示
<.>

4. Attribut Opacité

  • Élément masqué opacity: 0;

  • Élément affiché opacity: 1;

La signification de l'attribut opacité Récupère ou définit l'opacité de l'objet. Lorsque sa transparence est de 0, il disparaît visuellement mais il occupe toujours cette position et affecte la mise en page de la page Web.

Remarque : Pour les éléments avec l'attribut opacité ajouté, leur arrière-plan et le contenu de l'élément changeront également en conséquence.

(Partage vidéo d'apprentissage :

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