Masquer et afficher les éléments CSS-tutoriel CSS-php.cn

Masquer et afficher les éléments CSS

不言

Libérer： 2018-04-24 16:49:48

original

1713 Les gens l'ont consulté

Afficher et masquer

1. Introduction :

affichage : Faire apparaître le paragraphe à l'intérieur. la ligne Box

visibilité : Attribut précise si l'élément est visible.

2. attribut d'affichage

). ). ). ).

)
valeur	description
aucun	Cet élément ne sera pas affiché.
bloc	Cet élément sera affiché comme un élément de niveau bloc, avec des sauts de ligne avant et après celui-ci élément.
en ligne	Par défaut. Cet élément sera affiché comme un élément en ligne sans saut de ligne avant ou après l'élément.
inline-block	Élément de bloc en ligne. (Nouvelle valeur en CSS2.1)
list-item	Cet élément sera affiché sous forme de liste.
run-in	Cet élément apparaîtra comme un élément de niveau bloc ou un élément en ligne, selon le contexte.
compact	Il existe une valeur compacte en CSS, mais elle a été supprimée de CSS2.1 en raison de manque de soutien généralisé.
marker	Il existe un marqueur de valeur en CSS, mais il a été supprimé de CSS2.1 en raison de manque de soutien généralisé.
table	Cet élément sera affiché sous forme de tableau au niveau du bloc (similaire à < table>), avec des sauts de ligne avant et après le tableau.
inline-table	Cet élément sera affiché sous forme de tableau en ligne (similaire à < table> ;), il n'y a pas de saut de ligne avant et après le tableau.
table-row-group	Cet élément sera affiché sous la forme d'un groupe d'une ou plusieurs lignes (similaires à
table-header-group	Cet élément sera affiché sous forme de groupe d'une ou plusieurs lignes (similaires à
table-footer-group	Cet élément sera affiché sous forme de groupe d'une ou plusieurs lignes (similaires à
table-row	Cet élément sera affiché sous forme de ligne de tableau (similaire à < tr>).
table-column-group	Cet élément sera affiché sous forme de groupe d'une ou plusieurs colonnes (similaires à
table-column	Cet élément sera affiché sous forme de colonne de cellules (similaire à < col> ;)
table-cell	Cet élément sera affiché sous forme de cellule de tableau (similaire à	et	)
légende-table	Cet élément sera affiché sous forme de titre de tableau (similaire à
hériter	spécifie que la valeur de l'attribut display doit être héritée de l'élément parent.

3. Attribut de visibilité

visible Valeur par défaut. L'élément est visible. L'élément caché est invisible. collapseLorsqu'elle est utilisée dans un élément de tableau, cette valeur supprime une ligne ou une colonne, mais ce n'est pas le cas Cela affectera la disposition de la table. L'espace occupé par les lignes ou les colonnes est mis à disposition pour d'autres contenus. Si cette valeur est utilisée sur un autre élément, elle sera rendue "cachée". inherit spécifie que la valeur de l'attribut de visibilité doit être héritée de l'élément parent.

4. "display:none" et "visibility:hidden"

(1) display:none : Une fois l'élément masqué, il n'occupe pas sa position d'origine

(2 ) visibilité : masqué : Une fois l'élément masqué, il occupe sa position d'origine

5. Exemple

  h1{
          visibility: hidden;//隐藏占用元素空间
          display: none;//隐藏不占用空间
      }
  p{
          display: inline;//改变为内联元素
      }
  h2{
          display: block;//改变块级元素
      }

Copier après la connexion

Recommandations associées :

Explication détaillée Une façon simple de centrer les éléments CSS

值	描述
visible	默认值。元素是可见的。
hidden	元素是不可见的。
collapse	当在表格元素中使用时，此值可删除一行或一列，但是它不会影响表格的布局。被行或列占据的空间会留给其他内容使用。如果此值被用在其他的元素上，会呈现为 "hidden"。
inherit	规定应该从父元素继承 visibility 属性的值。

Valeur

Description

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!