Que signifie display:none ?-tutoriel HTML-php.cn

Que signifie display:none ?

hzc

Libérer： 2022-04-01 18:08:54

original

58531 Les gens l'ont consulté

"display:none" signifie définir l'élément pour qu'il soit invisible et même ne pas générer de modèle de boîte. Il est généralement utilisé pour les éléments cachés qui ne prennent pas de place. L'attribut display précise le type de boîte que l'élément doit générer. Lorsque sa valeur est "aucun", on peut préciser que l'élément ne génère pas de boîte. Cacher l'élément peut être compris comme supprimer l'élément de la page.

Que signifie display:none ?

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

display:none signifie :

"display:none" signifie que l'élément de réglage est invisible et même le modèle de boîte n'est pas généré. Généralement utilisé pour les éléments cachés qui ne prennent pas de place.

Le style "display:none" cache véritablement des éléments selon le sens du mot. L'attribut

display précise le type de boite que l'élément doit générer. Lorsque sa valeur est "none", on peut préciser que l'élément ne génère pas de boite.

Grâce à l'attribut display, les éléments masqués n'occupent aucun espace. De plus, une fois l'affichage défini sur aucun, toute opération d'interaction directe de l'utilisateur sur l'élément ne sera pas efficace.

Utilisez "display:none" pour masquer l'élément sans prendre de place. Par conséquent, la modification dynamique de cet attribut entraînera un réarrangement (modification de la mise en page), ce qui peut être compris comme la suppression de l'élément de la page. Il ne sera pas hérité par les descendants, mais ses descendants ne seront pas affichés. Après tout, ils sont tous cachés ensemble.

Jetons un coup d'œil à l'utilisation de display:none.

<html>
<head>
<title></title>
<style type="text/css">
    div{
		background: lightblue;
        width: 200px;
        height: 200px;
    }
    span{
        background: pink;
        display: none;
    }
</style>
</head>
<body >
    <div><span>需要隐藏的区域</span></div>
</body>
</html>

Copier après la connexion

définit la valeur de l'attribut display:none, et l'effet est comme indiqué dans la figure ci-dessous : la zone qui doit être masquée est masquée.

Que signifie display:none ?