Maison > Article > interface Web > Quelles commandes sont cachées en CSS
Il existe trois commandes de masquage en CSS, à savoir : 1. Utilisez "display:none" pour masquer tout le contenu sans occuper la position ; 2. Utilisez "visibility:hidden" pour masquer le contenu sans occuper la position ; 3. Utilisez "overflow:hidden" pour masquer le contenu de débordement.
L'environnement d'exploitation de ce tutoriel : système Windows 7, version HTML5&&CSS3, ordinateur Dell G3.
3 méthodes et valeurs d'attribut pour masquer le contenu en CSS
Lors de la création de pages Web, le masquage du contenu est également une méthode relativement courante. Ses fonctions incluent généralement : Masquer. texte/images, masquer les liens, masquer le contenu hors de portée, masquer les calques contextuels, masquer les barres de défilement, effacer le désalignement et le flottement, etc. Utilisez CSS pour masquer le contenu mentionné ci-dessus. Plusieurs méthodes pour masquer le contenu :
1 Utilisez display:none pour masquer tout le contenu
display:none peut. empêcher tout le contenu de la page Web d'être affiché, tel que le code, le texte, les liens, les images et les couches p. C'est la méthode recommandée pour masquer le contenu.
<p style="display:none;">我不占地儿，你看不见我；</p>
| 值 | 描述 |
|---|---|
| none | 此元素不会被显示。 |
| block | 此元素将显示为块级元素，此元素前后会带有换行符。 |
| inline | 默认。此元素会被显示为内联元素，元素前后没有换行符。 |
| run-in | 此元素会根据上下文作为块级元素或内联元素显示。 |
| inherit | 规定应该从父元素继承 display 属性的值。 |
2. Utilisez visibilité:hidden pour masquer le contenu
visibility:hidden et display:none peuvent masquer presque le même contenu. , mais la seule différence est que même s'il masque le contenu, le contenu masqué occupe toujours de l'espace. La position où le contenu est masqué mais l'espace est conservé sera affichée comme vide sur la page Web.
<p style="visibility:hidden;">我占了地儿，你也看不见我；</p>
| 值 | 描述 |
|---|---|
| visible | 默认值。元素是可见的。 |
| hidden | 元素是不可见的。 |
| collapse | 当在表格元素中使用时，此值可删除一行或一列，但是它不会影响表格的布局。被行或列占据的空间会留给其他内容使用。如果此值被用在其他的元素上，会呈现为 "hidden"。 |
| inherit | 规定应该从父元素继承 visibility 属性的值。 |
3. Utilisez overflow:hidden pour masquer le contenu de débordement
overflow:hidden Cette méthode peut masquer le contenu en dehors de la zone fixe contenu, il peut contrôler efficacement la zone d’affichage. Mais il convient de noter que lors de son utilisation, vous devez en définir la largeur et la hauteur, sinon il sera invalide
<p style="width:120px; height:20px; overflow:hidden;">我占的地儿太多了你就看不见我的尾巴了。。。。。</p>
Il y a une branche dans l'utilisation du débordement, overflow-x:hidden et overflow-y:hidden, x est la plage horizontale, y est la plage verticale, ces deux propriétés sont souvent utilisées lorsque la barre de défilement doit être masquée.
| 值 | 描述 |
|---|---|
| visible | 默认值。内容不会被修剪，会呈现在元素框之外。 |
| hidden | 内容会被修剪，并且其余内容是不可见的。 |
| scroll | 内容会被修剪，但是浏览器会显示滚动条以便查看其余的内容。 |
| auto | 如果内容被修剪，则浏览器会显示滚动条以便查看其余的内容。 |
| inherit | 规定应该从父元素继承 overflow 属性的值。 |
[Recommandé : "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!