Sur cette page, vous trouverez tous les groupes de propriétés CSS3 avec des références et de courtes descriptions.

Liste des Propriétés CSS3

Les Propriétés d’animation

La propriété	La description
animation	Anime (passe progressivement d’un style à un autre) les propriétés CSS avec des valeurs discrètes.
animation-delay	Spécifie quand une animation va démarrer.
animation-direction	Définit comment l’animation doit être jouée : vers l’avant, vers l’arrière ou en alternance.
animation-duration	Définit la durée (en secondes ou en millisecondes) qu’une animation prend pour compléter un cycle d’animation.
animation-fill-mode	Définit un style à l’élément, lorsque l’animation n’est pas exécutée (avant qu’elle commence, après qu’elle se termine, ou les deux).
animation-iteration-count	Définit combien de fois l’animation doit être jouée.
animation-name	Définit le nom de la règle @keyframes, que vous voulez appliquer. Elle a deux valeurs: none et keyframename.
animation-play-state	Spécifie si l’animation est en cours ou en pause.
animation-timing-function	Définit comment l’animation progressera pendant la durée de chaque cycle, et non pendant toute l’animation.
@keyframes	La règle @keyframes est la base pour les animations keyframe, utilisées pour animer (passer progressivement d’un style à un autre) de nombreuses propriétés CSS.

Les Propriétés de Fond

La propriété	La description
background-clip	Spécifie la distance entre les propriétés background-color et background-image.
background-origin	Spécifie la zone de positionnement de l’arrière-plan de la propriété background-image.
background-size	Définit la taille de l’image de fond.

Les Propriétés de Bordure

La propriété	La description
border-bottom-left-radius	Définit la forme ronde du coin inférieur-gauche de l’élément.
border-bottom-right-radius	Définit l’arrondissement du coin inférieur-droit de l’élément.
border-image	Permet de spécifier une image comme bordure autour d’un élément.
border-image-outset	Spécifie la quantité, par laquelle l’image de bordure est étendue au-delà de la boîte de bordure de l’élément.
border-image-repeat	Spécifie si la propriété border-image sera arrondie, répétée ou étirée.
border-image-slice	Spécifie comment couper l’image, spécifiée par la propriété border-image-source, en neuf régions : quatre coins, quatre bords, une partie centrale.
border-image-source	Définit l’image source, pour créer l’image de bordure d’un élément.
border-image-width	Définit la largeur de l’image de bordure.
border-radius	Fait des coins arrondis pour le bord extérieur d’un élément.
border-top-left-radius	Définit l’arrondissement du coin supérieure-gauche de l’élément. Il existe trois types d’arrondissement.
border-top-right-radius	Définit la forme ronde du coin supérieur-droit de l’élément. Il y a trois types d’arrondissement.

Les Propriétés de Couleur

La propriété	La description
opacity	Spécifie la transparence d’un élément.

Mise en Page de la Boîte Flexible

La propriété	La description
align-content	Aligne les lignes d’un conteneur flex, lorsqu’il y a de l’espace disponible verticalement (sur l’axe transversal).
align-items	Définit l’alignement par défaut pour les éléments flex. Il est le même, que la propriété justify-content , mais la version verticale..
flex	Spécifie les composants d’une longueur flexible.
flex-basis	Définit la taille initiale principale de l’élément flexible.
flex-direction	Définit l’axe principal d’un conteneur flex et l’ordre, dans lequel les éléments flex apparaissent.
flex-flow	Une propriété raccourcie pour les propriétés flex-wrap et flex-direction .
flex-grow	Spécifie combien l’élément va croître, par rapport au reste des éléments du conteneur flex.
flex-shrink	Spécifie combien l’élément va rétrécir par rapport au reste des éléments du conteneur flex.
flex-wrap	Specifies if the flexible items should wrap or not.
justify-content	Aligne les éléments, lorsque les éléments n’utilisent pas tout l’espace disponible horizontalement.
order	Spécifie l’ordre d’un élément flexible à l’intérieur du conteneur flex ou grille.

Les propriété de Police

La propriété	La escription
font-size-adjust	Contrôle la taille de la police, lorsque la première police sélectionnée n’est pas disponible.
font-stretch	Rend le texte plus étroit ou plus large.

Les propriétés de Mise en Page Multi-colonnes

La propriété	La description
column-count	Spécifie si la propriété border-image sera arrondie, répétée ou étirée..
column-fill	Contrôle le contenu de l’élément, lorsqu’il est divisé en colonnes.
column-gap	Définit la longueur de l’écart entre les colonnes.
column-rule	Définit le style, la largeur et la couleur de la règle entre les colonnes.
column-rule-color	Définit la couleur de la règle.
column-rule-style	Définit le style de la règle entre les colonnes.
column-rule-width	Définit la largeur de la règle entre les colonnes.
column-span	Spécifie si l'élément s'étend sur une colonne ou toutes les colonnes. .
column-width	Définit la largeur des colonnes.
columns	Une propriété raccourcie pour les propriétés column-count et column-width.

Les Propriétés de Contour

La propriété	La description
outline-offset	Spécifie l’espace entre un contour et le bord d’un élément.

Les Propriétés de Texte

La propriété	La description
tab-size	Définit la largeur d’un caractère d’onglet.
text-align-last	Définit l’alignement de la dernière ligne du texte.
text-decoration-color	Définit la couleur de la décoration de texte.
text-decoration-line	Spécifie le type de ligne, qui sera utilisé pour la décoration de texte.
text-decoration-style	Spécifie le style de la décoration de texte.
text-justify	Définit l'attitude de l’espacement entre les mots ou les caractères.
text-overflow	Spécifie comment le texte en ligne débordant doit être signalé à l’utilisateur.
text-shadow	Permet d’ajouter des ombres au texte.
column-width	Définit la largeur des colonnes.
word-break	Spécifie où les lignes doivent être brisées.
word-wrap	Permet de briser les lignes en mots, de manière à s’adapter à son contenant.

Les Propriétés de Transformation

La propriété	La description
backface-visibility	Spécifie si la face arrière d’un élément doit être visible ou non.
perspective	Donne à un élément positionné en 3D une certaine perspective et détermine la distance entre le plan z=0.
perspective-origin	Définit la position à laquelle l’utilisateur regarde l’élément positionné en 3D.
transform	Spécifie la transformation bidimensionnelle ou tridimensionnelle de l’élément.
transform-origin	Permet de modifier la position de la transformation des éléments.
transform-style	Spécifie comment les éléments enfants sont rendus dans l’espace tridimensionnel (3D).

Les Propriétés de Transition

La propriété	La description
transition	Une propriété raccourcie pour les propriétés suivantes: transition-property, transition-duration, transition-timing-function, transition-delay
transition-delay	Spécifie quand l’effet de transition doit commencer.
transition-duration	Spécifie la durée de l’animation de transition.
transition-property	Spécifie les noms des propriétés pour la transition.
transition-timing-function	Spécifie l'instance de la transition sur sa durée, permettant de changer la vitesse.

Propriétés de Formatage Visuel

La propriété	La description
overflow-x	Spécifie si le contenu doit être caché, visible ou défile horizontalement, lorsque le contenu déborde des bords gauche et droit de l’élément.
overflow-y	Spécifie si le contenu doit être caché, visible ou défile verticalement, lorsque le contenu déborde des bords supérieurs et inférieurs de l’élément.
resize	Spécifie comment l’élément est redimensionnable.
box-shadow	Permet d’implémenter plusieurs ombres autour de la boîte en spécifiant des valeurs pour la couleur, la taille, le flou, le décalage et l’encart.
box-sizing	Définit le calcul de la largeur et de la hauteur d’un élément, s’ils comprennent la rembourrage et les bordures.