Maison > interface Web > tutoriel HTML > Comment rendre un élément invisible en HTML

Comment rendre un élément invisible en HTML

青灯夜游
Libérer: 2021-10-11 11:42:14
original
9439 Les gens l'ont consulté

Comment définir des éléments invisibles en HTML : 1. Ajoutez l'attribut caché dans la balise element ; 2. Utilisez l'attribut style dans la balise element pour définir le style "display:none" 3. Utilisez l'attribut style dans l'élément ; balise pour définir le style "visibilité: caché".

Comment rendre un élément invisible en HTML

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

Il existe trois façons de rendre des éléments invisibles en HTML :

  • Utilisez l'attribut caché
  • Utilisez l'attribut style pour définir l'affichage : aucun
  • Utilisez l'attribut style pour définir la visibilité : false

Évidemment, il existe deux façons de rendre éléments invisibles :

  • L'élément est complètement invisible, l'élément n'occupe pas l'espace, comme s'il avait disparu
  • L'élément est invisible, mais il occupe toujours l'espace d'origine, comme s'il était invisible

Utilisez l'attribut caché

<div hidden>hello</div>
Copier après la connexion

Utilisation L'effet de l'attribut caché est de changer automatiquement l'attribut d'affichage de l'élément sur aucun lors du rendu du DOM. Notez que la seule utilisation de l'attribut caché est ici : changez simplement l'affichage sur aucun la première fois que vous ajoutez l'attribut caché. À l'avenir, même si l'attribut d'affichage devient bloc, l'attribut caché sera toujours là.

On peut voir que Hidden et display=none ont le même effet. Mais ce n’est pas aussi direct et fondamental que l’affichage. Par conséquent, n'utilisez pas l'attribut caché à l'avenir et accédez directement à l'attribut d'affichage avec style.

Utilisez l'attribut style pour définir display:none

Le style display=none peut faire disparaître complètement un élément sans laisser de trace et ne prendre aucun espace.

<div style="display:none">hello</div>
Copier après la connexion

Utilisez l'attribut style pour définir la visibilité=caché

Lorsque visibilité=caché dans le style, l'élément semble être invisible, mais il occupe toujours l'espace d'origine.

<div style="visibility:hidden">hello</div>
Copier après la connexion

Tutoriel recommandé : "Tutoriel vidéo HTML"

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!

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
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
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal