mozilla
Vos résultats de recherche

    Propriétés CSS animées

    Cette page liste toutes les propriétés CSS et indique si elles sont animables, et comment.

    Animations
    Propriété Animable
    animation non
    animation-delay non
    animation-direction non
     
    animation-duration non
    animation-fill-mode non
    animation-iteration-count non
     
    animation-name non
     
    animation-play-state non
    animation-timing-function non
    Transitions
    Propriété Animable
    transition non
    transition-delay non
    transition-duration non
    transition-property non
    transition-timing-function non
    Transformations
    Propriété Animable
    transform oui, comme une transformation
    transform-origin oui, comme une simple liste de une longueur, pourcentage ou calc() ; quand les deux valeurs sont des longueurs, elles sont interpolées comme des longueurs ; quand les deux valeurs sont des pourcentages, elles sont interpolées comme des pourcentages ; sinon, les deux valeurs sont converties dans une fonction calc() qui est la somme d'une longueur et d'un pourcentage (chaque valeur pouvant être à zéro), et cette fonction calc() interpole chaque moitié comme un nombre réel.
    transform-style non
    perspective oui, comme une longueur
    perspective-origin oui, comme une simple liste de une longueur, pourcentage ou calc() ; quand les deux valeurs sont des longueurs, elles sont interpolées comme des longueurs ; quand les deux valeurs sont des pourcentages, elles sont interpolées comme des pourcentages ; sinon, les deux valeurs sont converties dans une fonction calc() qui est la somme d'une longueur et d'un pourcentage (chaque valeur pouvant être à zéro), et cette fonction calc() interpole chaque moitié comme un nombre réel.
    backface-visibility non
    Couleur
    Propriété Animable
    color oui, comme une couleur
    opacity oui, comme un nombre
    Colonnes
    Propriété Animable
    columns pour chaque propriété individuelle de la propriété raccourcie :
    • column-width: oui, comme une longueur
    • column-count: oui, comme un entier
    column-width oui, comme une longueur
    column-count oui, comme un entier
    column-gap oui, comme une longueur
    column-rule pour chaque propriété individuelle de la propriété raccourcie :
    • column-rule-color: oui, comme une couleur
    • column-rule-style: non
    • column-rule-width: oui, comme une longueur
    column-rule-color oui, comme une couleur
    column-rule-style non
    column-rule-width oui, comme une longueur
    break-before non
    break-after non
    break-inside non
    column-span non
    column-fill non
    Texte
    Propriété Animable
    hyphens non
    letter-spacing oui, comme une longueur
    word-wrap non
    overflow-wrap non
    text-transform non
    tab-size non (Cela peut changer d'ici à ce que la spécification atteigne le statut de Candidate Recommendation)
    text-align non
    text-align-last non
    text-indent oui, comme une longueur, pourcentage ou calc() ; quand les deux valeurs sont des longueurs, elles sont interpolées comme des longueurs ; quand les deux valeurs sont des pourcentages, elles sont interpolées comme des pourcentages ; sinon, les deux valeurs sont converties dans une fonction calc() qui est la somme d'une longueur et d'un pourcentage (chaque valeur pouvant être à zéro), et cette fonction calc() interpole chaque moitié comme un nombre réel.
    direction non
    white-space non
    word-break non
    word-spacing oui, comme une longueur
    Décorations de texte
    Propriété Animable
    text-decoration pour chaque propriété individuelle de la propriété raccourcie :
    • text-decoration-color: oui, comme une couleur
    • text-decoration-style: non
    • text-decoration-line: non
    text-decoration-color oui, comme une couleur
    text-decoration-style non
    text-decoration-line non
    text-decoration-skip non
    text-shadow oui, comme une liste d'ombres
    text-underline-position non
    Boîtes flexibles
    Propriété Animable
    align-content non
    align-items non
    align-self non
    flex-basis oui, comme une longueur, pourcentage ou calc() ; quand les deux valeurs sont des longueurs, elles sont interpolées comme des longueurs ; quand les deux valeurs sont des pourcentages, elles sont interpolées comme des pourcentages ; sinon, les deux valeurs sont converties dans une fonction calc() qui est la somme d'une longueur et d'un pourcentage (chaque valeur pouvant être à zéro), et cette fonction calc() interpole chaque moitié comme un nombre réel.
    flex-direction non
    flex-flow non
    flex-grow oui, comme un nombre, except between 0 and other values
    flex-shrink oui, comme un nombre, except between 0 and other values
    flex pour chaque propriété individuelle de la propriété raccourcie :
    • flex-grow: oui, comme un nombre, except between 0 and other values
    • flex-shrink: oui, comme un nombre, except between 0 and other values
    • flex-basis: oui, comme une longueur, pourcentage ou calc() ; quand les deux valeurs sont des longueurs, elles sont interpolées comme des longueurs ; quand les deux valeurs sont des pourcentages, elles sont interpolées comme des pourcentages ; sinon, les deux valeurs sont converties dans une fonction calc() qui est la somme d'une longueur et d'un pourcentage (chaque valeur pouvant être à zéro), et cette fonction calc() interpole chaque moitié comme un nombre réel.
    flex-wrap non
    justify-content non
    order oui, comme un entier
    Arrière-plans et bordures
    Propriété Animable
    background pour chaque propriété individuelle de la propriété raccourcie :
    • background-color: oui, comme une couleur
    • background-image: non
    • background-clip: non
    • background-position: oui, comme une liste répétable de une simple liste de une longueur, pourcentage ou calc() ; quand les deux valeurs sont des longueurs, elles sont interpolées comme des longueurs ; quand les deux valeurs sont des pourcentages, elles sont interpolées comme des pourcentages ; sinon, les deux valeurs sont converties dans une fonction calc() qui est la somme d'une longueur et d'un pourcentage (chaque valeur pouvant être à zéro), et cette fonction calc() interpole chaque moitié comme un nombre réel.
    • background-size: oui, comme une liste répétable de une simple liste de une longueur, pourcentage ou calc() ; quand les deux valeurs sont des longueurs, elles sont interpolées comme des longueurs ; quand les deux valeurs sont des pourcentages, elles sont interpolées comme des pourcentages ; sinon, les deux valeurs sont converties dans une fonction calc() qui est la somme d'une longueur et d'un pourcentage (chaque valeur pouvant être à zéro), et cette fonction calc() interpole chaque moitié comme un nombre réel. . This means keyword values are not animatable.
    • background-repeat: non
    • background-attachment: non
    background-attachment non
    background-clip non
    background-color oui, comme une couleur
    background-image non
    background-origin non
    background-position oui, comme une liste répétable de une simple liste de une longueur, pourcentage ou calc() ; quand les deux valeurs sont des longueurs, elles sont interpolées comme des longueurs ; quand les deux valeurs sont des pourcentages, elles sont interpolées comme des pourcentages ; sinon, les deux valeurs sont converties dans une fonction calc() qui est la somme d'une longueur et d'un pourcentage (chaque valeur pouvant être à zéro), et cette fonction calc() interpole chaque moitié comme un nombre réel.
    background-repeat non
    background-size oui, comme une liste répétable de une simple liste de une longueur, pourcentage ou calc() ; quand les deux valeurs sont des longueurs, elles sont interpolées comme des longueurs ; quand les deux valeurs sont des pourcentages, elles sont interpolées comme des pourcentages ; sinon, les deux valeurs sont converties dans une fonction calc() qui est la somme d'une longueur et d'un pourcentage (chaque valeur pouvant être à zéro), et cette fonction calc() interpole chaque moitié comme un nombre réel. . This means keyword values are not animatable.
    border pour chaque propriété individuelle de la propriété raccourcie :
    • border-color: pour chaque propriété individuelle de la propriété raccourcie :
      • border-bottom-color: oui, comme une couleur
      • border-left-color: oui, comme une couleur
      • border-right-color: oui, comme une couleur
      • border-top-color: oui, comme une couleur
    • border-style: non
    • border-width: pour chaque propriété individuelle de la propriété raccourcie :
      • border-bottom-width: oui, comme une longueur
      • border-left-width: oui, comme une longueur
      • border-right-width: oui, comme une longueur
      • border-top-width: oui, comme une longueur
    border-bottom pour chaque propriété individuelle de la propriété raccourcie :
    • border-bottom-color: oui, comme une couleur
    • border-bottom-style: non
    • border-bottom-width: oui, comme une longueur
    border-bottom-color oui, comme une couleur
    border-bottom-left-radius oui, comme une longueur, pourcentage ou calc() ; quand les deux valeurs sont des longueurs, elles sont interpolées comme des longueurs ; quand les deux valeurs sont des pourcentages, elles sont interpolées comme des pourcentages ; sinon, les deux valeurs sont converties dans une fonction calc() qui est la somme d'une longueur et d'un pourcentage (chaque valeur pouvant être à zéro), et cette fonction calc() interpole chaque moitié comme un nombre réel.
    border-bottom-right-radius oui, comme une longueur, pourcentage ou calc() ; quand les deux valeurs sont des longueurs, elles sont interpolées comme des longueurs ; quand les deux valeurs sont des pourcentages, elles sont interpolées comme des pourcentages ; sinon, les deux valeurs sont converties dans une fonction calc() qui est la somme d'une longueur et d'un pourcentage (chaque valeur pouvant être à zéro), et cette fonction calc() interpole chaque moitié comme un nombre réel.
    border-bottom-style non
    border-bottom-width oui, comme une longueur
    border-color pour chaque propriété individuelle de la propriété raccourcie :
    • border-bottom-color: oui, comme une couleur
    • border-left-color: oui, comme une couleur
    • border-right-color: oui, comme une couleur
    • border-top-color: oui, comme une couleur
    border-image non
    border-image-outset non
    border-image-repeat non
    border-image-slice non
    border-image-source non
    border-image-width non
    border-left pour chaque propriété individuelle de la propriété raccourcie :
    • border-left-color: oui, comme une couleur
    • border-left-style: non
    • border-left-width: oui, comme une longueur
    border-left-color oui, comme une couleur
    border-left-style non
    border-left-width oui, comme une longueur
    border-radius pour chaque propriété individuelle de la propriété raccourcie :
    • border-top-left-radius: oui, comme une longueur, pourcentage ou calc() ; quand les deux valeurs sont des longueurs, elles sont interpolées comme des longueurs ; quand les deux valeurs sont des pourcentages, elles sont interpolées comme des pourcentages ; sinon, les deux valeurs sont converties dans une fonction calc() qui est la somme d'une longueur et d'un pourcentage (chaque valeur pouvant être à zéro), et cette fonction calc() interpole chaque moitié comme un nombre réel.
    • border-top-right-radius: oui, comme une longueur, pourcentage ou calc() ; quand les deux valeurs sont des longueurs, elles sont interpolées comme des longueurs ; quand les deux valeurs sont des pourcentages, elles sont interpolées comme des pourcentages ; sinon, les deux valeurs sont converties dans une fonction calc() qui est la somme d'une longueur et d'un pourcentage (chaque valeur pouvant être à zéro), et cette fonction calc() interpole chaque moitié comme un nombre réel.
    • border-bottom-right-radius: oui, comme une longueur, pourcentage ou calc() ; quand les deux valeurs sont des longueurs, elles sont interpolées comme des longueurs ; quand les deux valeurs sont des pourcentages, elles sont interpolées comme des pourcentages ; sinon, les deux valeurs sont converties dans une fonction calc() qui est la somme d'une longueur et d'un pourcentage (chaque valeur pouvant être à zéro), et cette fonction calc() interpole chaque moitié comme un nombre réel.
    • border-bottom-left-radius: oui, comme une longueur, pourcentage ou calc() ; quand les deux valeurs sont des longueurs, elles sont interpolées comme des longueurs ; quand les deux valeurs sont des pourcentages, elles sont interpolées comme des pourcentages ; sinon, les deux valeurs sont converties dans une fonction calc() qui est la somme d'une longueur et d'un pourcentage (chaque valeur pouvant être à zéro), et cette fonction calc() interpole chaque moitié comme un nombre réel.
    border-right pour chaque propriété individuelle de la propriété raccourcie :
    • border-right-color: oui, comme une couleur
    • border-right-style: non
    • border-right-width: oui, comme une longueur
    border-right-color oui, comme une couleur
    border-right-style non
    border-right-width oui, comme une longueur
    border-style non
    border-top pour chaque propriété individuelle de la propriété raccourcie :
    • border-top-color: oui, comme une couleur
    • border-top-style: non
    • border-top-width: oui, comme une longueur
    border-top-color oui, comme une couleur
    border-top-left-radius oui, comme une longueur, pourcentage ou calc() ; quand les deux valeurs sont des longueurs, elles sont interpolées comme des longueurs ; quand les deux valeurs sont des pourcentages, elles sont interpolées comme des pourcentages ; sinon, les deux valeurs sont converties dans une fonction calc() qui est la somme d'une longueur et d'un pourcentage (chaque valeur pouvant être à zéro), et cette fonction calc() interpole chaque moitié comme un nombre réel.
    border-top-right-radius oui, comme une longueur, pourcentage ou calc() ; quand les deux valeurs sont des longueurs, elles sont interpolées comme des longueurs ; quand les deux valeurs sont des pourcentages, elles sont interpolées comme des pourcentages ; sinon, les deux valeurs sont converties dans une fonction calc() qui est la somme d'une longueur et d'un pourcentage (chaque valeur pouvant être à zéro), et cette fonction calc() interpole chaque moitié comme un nombre réel.
    border-top-style non
    border-top-width oui, comme une longueur
    border-width pour chaque propriété individuelle de la propriété raccourcie :
    • border-bottom-width: oui, comme une longueur
    • border-left-width: oui, comme une longueur
    • border-right-width: oui, comme une longueur
    • border-top-width: oui, comme une longueur
    Modèle de boîte
    Propriété Animable
    box-decoration-break non
    box-shadow oui, comme une liste d'ombres
    margin oui, comme une longueur
    margin-bottom oui, comme une longueur
    margin-left oui, comme une longueur
    margin-right oui, comme une longueur
    margin-top oui, comme une longueur
    padding oui, comme une longueur
    padding-bottom oui, comme une longueur
    padding-left oui, comme une longueur
    padding-right oui, comme une longueur
    padding-top oui, comme une longueur
    box-sizing non
    max-height oui, comme une longueur, pourcentage ou calc() ; quand les deux valeurs sont des longueurs, elles sont interpolées comme des longueurs ; quand les deux valeurs sont des pourcentages, elles sont interpolées comme des pourcentages ; sinon, les deux valeurs sont converties dans une fonction calc() qui est la somme d'une longueur et d'un pourcentage (chaque valeur pouvant être à zéro), et cette fonction calc() interpole chaque moitié comme un nombre réel.
    min-height oui, comme une longueur, pourcentage ou calc() ; quand les deux valeurs sont des longueurs, elles sont interpolées comme des longueurs ; quand les deux valeurs sont des pourcentages, elles sont interpolées comme des pourcentages ; sinon, les deux valeurs sont converties dans une fonction calc() qui est la somme d'une longueur et d'un pourcentage (chaque valeur pouvant être à zéro), et cette fonction calc() interpole chaque moitié comme un nombre réel.
    height oui, comme une longueur, pourcentage ou calc() ; quand les deux valeurs sont des longueurs, elles sont interpolées comme des longueurs ; quand les deux valeurs sont des pourcentages, elles sont interpolées comme des pourcentages ; sinon, les deux valeurs sont converties dans une fonction calc() qui est la somme d'une longueur et d'un pourcentage (chaque valeur pouvant être à zéro), et cette fonction calc() interpole chaque moitié comme un nombre réel.
    max-width oui, comme une longueur, pourcentage ou calc() ; quand les deux valeurs sont des longueurs, elles sont interpolées comme des longueurs ; quand les deux valeurs sont des pourcentages, elles sont interpolées comme des pourcentages ; sinon, les deux valeurs sont converties dans une fonction calc() qui est la somme d'une longueur et d'un pourcentage (chaque valeur pouvant être à zéro), et cette fonction calc() interpole chaque moitié comme un nombre réel.
    min-width oui, comme une longueur, pourcentage ou calc() ; quand les deux valeurs sont des longueurs, elles sont interpolées comme des longueurs ; quand les deux valeurs sont des pourcentages, elles sont interpolées comme des pourcentages ; sinon, les deux valeurs sont converties dans une fonction calc() qui est la somme d'une longueur et d'un pourcentage (chaque valeur pouvant être à zéro), et cette fonction calc() interpole chaque moitié comme un nombre réel.
    width oui, comme une longueur, pourcentage ou calc() ; quand les deux valeurs sont des longueurs, elles sont interpolées comme des longueurs ; quand les deux valeurs sont des pourcentages, elles sont interpolées comme des pourcentages ; sinon, les deux valeurs sont converties dans une fonction calc() qui est la somme d'une longueur et d'un pourcentage (chaque valeur pouvant être à zéro), et cette fonction calc() interpole chaque moitié comme un nombre réel.
    overflow non
    overflow-x non
    overflow-y non
    visibility oui, comme une visibilité
    Tableau
    Propriété Animable
    border-collapse non
    border-spacing non
    caption-side non
    empty-cells non
    table-layout non
    vertical-align oui, comme une longueur
    Positionnement
    Propriété Animable
    bottom oui, comme une longueur, pourcentage ou calc() ; quand les deux valeurs sont des longueurs, elles sont interpolées comme des longueurs ; quand les deux valeurs sont des pourcentages, elles sont interpolées comme des pourcentages ; sinon, les deux valeurs sont converties dans une fonction calc() qui est la somme d'une longueur et d'un pourcentage (chaque valeur pouvant être à zéro), et cette fonction calc() interpole chaque moitié comme un nombre réel.
    left oui, comme une longueur, pourcentage ou calc() ; quand les deux valeurs sont des longueurs, elles sont interpolées comme des longueurs ; quand les deux valeurs sont des pourcentages, elles sont interpolées comme des pourcentages ; sinon, les deux valeurs sont converties dans une fonction calc() qui est la somme d'une longueur et d'un pourcentage (chaque valeur pouvant être à zéro), et cette fonction calc() interpole chaque moitié comme un nombre réel.
    right oui, comme une longueur, pourcentage ou calc() ; quand les deux valeurs sont des longueurs, elles sont interpolées comme des longueurs ; quand les deux valeurs sont des pourcentages, elles sont interpolées comme des pourcentages ; sinon, les deux valeurs sont converties dans une fonction calc() qui est la somme d'une longueur et d'un pourcentage (chaque valeur pouvant être à zéro), et cette fonction calc() interpole chaque moitié comme un nombre réel.
    top oui, comme une longueur, pourcentage ou calc() ; quand les deux valeurs sont des longueurs, elles sont interpolées comme des longueurs ; quand les deux valeurs sont des pourcentages, elles sont interpolées comme des pourcentages ; sinon, les deux valeurs sont converties dans une fonction calc() qui est la somme d'une longueur et d'un pourcentage (chaque valeur pouvant être à zéro), et cette fonction calc() interpole chaque moitié comme un nombre réel.
    float non
    clear non
    position non
    z-index oui, comme un entier
    Polices
    Propriété Animable
    font pour chaque propriété individuelle de la propriété raccourcie :
    font-family non
    font-variant non
    font-weight oui, comme une graisse de police
    font-stretch oui, comme une font stretch
    font-size oui, comme une longueur
    line-height oui, comme un nombre, une longueur
    font-feature-settings non
    font-size-adjust oui, comme un nombre
    font-style non
    Images
    Propriété Animable
    image-rendering non
    image-orientation non
    Compteurs et listes
    Propriété Animable
    counter-increment non
    counter-reset non
    list-style non
    list-style-image non
    list-style-position non
    list-style-type non
    Page
    Propriété Animable
    orphans non
    page-break-after non
    page-break-before non
    page-break-inside non
    widows non
    Interface utilisateur
    Propriété Animable
    outline pour chaque propriété individuelle de la propriété raccourcie :
    • outline-color: oui, comme une couleur
    • outline-width: oui, comme une longueur
    • outline-style: non
    outline-color oui, comme une couleur
    outline-width oui, comme une longueur
    outline-style non
    outline-offset oui, comme une longueur
    cursor non
    resize non
    text-overflow non
    Contenu généré
    Propriété Animable
    content non
    quotes non
    Divers
    Propriété Animable
    clip oui, comme un rectangle
    display non
    unicode-bidi non
    ime-mode non

     

    Étiquettes et contributeurs liés au document

    Étiquettes : 
    Contributors to this page: tregagnon, teoli
    Dernière mise à jour par : teoli,