CSS - affichage

La description

La propriété d' affichage affecte la présentation la plus élémentaire d'un élément, classant effectivement l'élément comme un certain type d'élément. Le rendu de l'élément peut dépendre fortement de son type d'affichage, et certaines propriétés ne fonctionneront que sur les éléments qui ont des valeurs d'affichage spécifiques.

Valeurs possibles

  • inline- Cette valeur amène un élément à générer une boîte de niveau en ligne; par exemple, les éléments HTML STRONG, CODE ou EM (entre autres). L'élément générera une ou plusieurs boîtes en ligne lors de son affichage.

  • block- Cette valeur amène un élément à générer une boîte au niveau du bloc; par exemple les éléments HTML P, H1 ou PRE (entre autres). L'élément générera une boîte de bloc lors de son affichage.

  • list-item- Cette valeur fait qu'un élément génère à la fois une boîte de bloc et une boîte en ligne d'élément de liste. En HTML, l'élément LI est le seul exemple d'un tel élément.

  • run-in- Dans certaines conditions, cette valeur entraînera l'insertion de l'élément. au début de l'élément suivant. Si un élément A est configuré pour afficher: run-in et est suivi d'un élément de niveau bloc B, alors A devient la première boîte de niveau en ligne de B.Si l'élément suivant A n'est pas de niveau bloc, alors A devient un boîte au niveau du bloc.

  • compact - Dans certaines conditions, cette valeur entraînera le placement de l'élément d'un côté de l'élément suivant.

  • marker- Cette valeur définira le contenu généré comme un marqueur; ainsi, il ne doit être utilisé qu'en conjonction avec les pseudo-éléments: before et: after lorsqu'ils sont définis sur des éléments de niveau bloc.

  • table- Cette valeur amène un élément à générer une boîte de table au niveau du bloc. Ceci est analogue à l'élément HTML TABLE.

  • inline-table- Cette valeur amène un élément à générer une boîte de table de niveau en ligne. Bien qu'il n'y ait pas d'analogue en HTML, il peut être envisagé comme un tableau HTML traditionnel qui peut apparaître au milieu d'une ligne de texte.

  • table-cell- Cette valeur déclare l'élément comme étant une cellule de tableau. Ceci est analogue à l'élément HTML TD.

  • table-row- Cette valeur déclare l'élément comme étant une ligne de cellules de tableau. Ceci est analogue à l'élément HTML TR.

  • table-row-group- Cette valeur déclare l'élément comme étant un groupe de lignes de table. Ceci est analogue à l'élément HTML TBODY.

  • table-column- Cette valeur déclare l'élément comme étant une colonne de cellules de tableau. Ceci est analogue à l'élément HTML COL.

  • table-column-group- Cette valeur déclare l'élément comme étant un groupe de colonnes de table. Ceci est analogue à l'élément HTML COLGROUP.

  • table-header-group- Cette valeur déclare l'élément comme étant un groupe de cellules qui est toujours visible en haut du tableau, placé avant toute ligne ou groupe de lignes mais après toutes les légendes de tableau alignées en haut. Ceci est analogue à l'élément HTML THEAD.

  • table-footer-group- Cette valeur déclare l'élément comme étant un groupe de cellules qui est toujours visible en bas du tableau, placé après toute ligne ou groupe de lignes mais avant toute légende de tableau alignée en bas. Ceci est analogue à l'élément HTML TFOOT.

  • table-caption- Cette valeur déclare l'élément comme une légende pour une table. Ceci est analogue à l'élément HTML CAPTION.

  • none - L'élément ne générera aucun encadré et ne sera donc ni affiché ni impacté la mise en page du document.

S'applique à

Tous les éléments HTML.

Syntaxe DOM

object.style.cueAfter = url("music.wav");

Exemple

Voici l'exemple -

<p style = "display:inline;">
   This paragraph will inline with the next paragraph
</p>

<p style = "display:inline;">
   and will make a single line.
</p>

<br />
<br />

<div style = "display:block;">
   This paragraph will be separate from the next paragraph
</div>

<div style = "display:block;">
   and this is second paragraph.
</div>

Cela produira le résultat suivant -

This paragraph will inline with the next paragraph

and will make a single line.



This paragraph will be separate from the next paragraph
and this is second paragraph.