mozilla
Your Search Results

    CSS animated properties

    このページは、すべての CSS プロパティの一覧と、各プロパティがアニメーション可能かどうかを示します。

    Animations
    プロパティ アニメーションの可否
    animation 不可
    animation-delay 不可
    animation-direction 不可
     
    animation-duration 不可
    animation-fill-mode 不可
    animation-iteration-count 不可
     
    animation-name 不可
     
    animation-play-state 不可
    animation-timing-function 不可
    Transitions
    プロパティ アニメーションの可否
    transition 不可
    transition-delay 不可
    transition-duration 不可
    transition-property 不可
    transition-timing-function 不可
    Transforms
    プロパティ アニメーションの可否
    transform 可。transform の値として補完します。
    transform-origin 可。length または percentage, calc();の単純なリスト形式 の値として補完します。両方の値が length の場合は、length 値として補完されます。両方の値が percentage の場合は、percentage 値として補完されます。それ以外の場合は、両方の値が calc() 関数にコンバートされ、length と percentage の合計になります (または各値が 0)。そして、これらの calc() 関数は、それぞれ半分ずつ補完された実数を持ちます。
    transform-style 不可
    perspective 可。length の値として補完します。
    perspective-origin 可。length または percentage, calc();の単純なリスト形式 の値として補完します。両方の値が length の場合は、length 値として補完されます。両方の値が percentage の場合は、percentage 値として補完されます。それ以外の場合は、両方の値が calc() 関数にコンバートされ、length と percentage の合計になります (または各値が 0)。そして、これらの calc() 関数は、それぞれ半分ずつ補完された実数を持ちます。
    backface-visibility 不可
    Color
    プロパティ アニメーションの可否
    color 可。color の値として補完します。
    opacity 可。number の値として補完します。
    Columns
    プロパティ アニメーションの可否
    columns 以下の各プロパティのショートハンドとして補完します:
    • column-width: 可。length の値として補完します。
    • column-count: 可。integer の値として補完します。
    column-width 可。length の値として補完します。
    column-count 可。integer の値として補完します。
    column-gap 可。length の値として補完します。
    column-rule 以下の各プロパティのショートハンドとして補完します:
    • column-rule-color: 可。color の値として補完します。
    • column-rule-style: 不可
    • column-rule-width: 可。length の値として補完します。
    column-rule-color 可。color の値として補完します。
    column-rule-style 不可
    column-rule-width 可。length の値として補完します。
    break-before 不可
    break-after 不可
    break-inside 不可
    column-span 不可
    column-fill 不可
    Text
    プロパティ アニメーションの可否
    hyphens 不可
    letter-spacing 可。length の値として補完します。
    word-wrap 不可
    overflow-wrap 不可
    text-transform 不可
    tab-size 不可 (このプロパティは、仕様が勧告候補に到達する前に変更される可能性があります)
    text-align 不可
    text-align-last 不可
    text-indent 可。length または percentage, calc(); の値として補完します。両方の値が length の場合は、length 値として補完されます。両方の値が percentage の場合は、percentage 値として補完されます。それ以外の場合は、両方の値が calc() 関数にコンバートされ、length と percentage の合計になります (または各値が 0)。そして、これらの calc() 関数は、それぞれ半分ずつ補完された実数を持ちます。
    direction 不可
    white-space 不可
    word-break 不可
    word-spacing 可。length の値として補完します。
    Text decorations
    プロパティ アニメーションの可否
    text-decoration 以下の各プロパティのショートハンドとして補完します:
    • text-decoration-color: 可。color の値として補完します。
    • text-decoration-style: 不可
    • text-decoration-line: 不可
    text-decoration-color 可。color の値として補完します。
    text-decoration-style 不可
    text-decoration-line 不可
    text-decoration-skip 不可
    text-underline-position 不可
    Flexible boxes
    プロパティ アニメーションの可否
    align-content 不可
    align-items 不可
    align-self 不可
    flex-basis 可。length または percentage, calc(); の値として補完します。両方の値が length の場合は、length 値として補完されます。両方の値が percentage の場合は、percentage 値として補完されます。それ以外の場合は、両方の値が calc() 関数にコンバートされ、length と percentage の合計になります (または各値が 0)。そして、これらの calc() 関数は、それぞれ半分ずつ補完された実数を持ちます。
    flex-direction 不可
    flex-flow 不可
    flex-grow 可。number の値として補完します。0 と他の値までの間を除く。
    flex-shrink 可。number の値として補完します。0 と他の値までの間を除く。
    flex 以下の各プロパティのショートハンドとして補完します:
    • flex-grow: 可。number の値として補完します。0 と他の値までの間を除く。
    • flex-shrink: 可。number の値として補完します。0 と他の値までの間を除く。
    • flex-basis: 可。length または percentage, calc(); の値として補完します。両方の値が length の場合は、length 値として補完されます。両方の値が percentage の場合は、percentage 値として補完されます。それ以外の場合は、両方の値が calc() 関数にコンバートされ、length と percentage の合計になります (または各値が 0)。そして、これらの calc() 関数は、それぞれ半分ずつ補完された実数を持ちます。
    flex-wrap 不可
    justify-content 不可
    order 可。integer の値として補完します。
    Background & Borders
    プロパティ アニメーションの可否
    background 以下の各プロパティのショートハンドとして補完します:
    • background-color: 可。color の値として補完します。
    • background-image: 不可
    • background-clip: 不可
    • background-position: 可。length または percentage, calc();の反復可能リストの単純なリスト形式 の値として補完します。両方の値が length の場合は、length 値として補完されます。両方の値が percentage の場合は、percentage 値として補完されます。それ以外の場合は、両方の値が calc() 関数にコンバートされ、length と percentage の合計になります (または各値が 0)。そして、これらの calc() 関数は、それぞれ半分ずつ補完された実数を持ちます。
    • background-size: 可。length または percentage, calc();の反復可能リストの単純なリスト形式 の値として補完します。両方の値が length の場合は、length 値として補完されます。両方の値が percentage の場合は、percentage 値として補完されます。それ以外の場合は、両方の値が calc() 関数にコンバートされ、length と percentage の合計になります (または各値が 0)。そして、これらの calc() 関数は、それぞれ半分ずつ補完された実数を持ちます。これは、keyword 値がアニメーション不可であることを意味します。
    • background-repeat: 不可
    • background-attachment: 不可
    background-attachment 不可
    background-clip 不可
    background-color 可。color の値として補完します。
    background-image 不可
    background-origin 不可
    background-position 可。length または percentage, calc();の反復可能リストの単純なリスト形式 の値として補完します。両方の値が length の場合は、length 値として補完されます。両方の値が percentage の場合は、percentage 値として補完されます。それ以外の場合は、両方の値が calc() 関数にコンバートされ、length と percentage の合計になります (または各値が 0)。そして、これらの calc() 関数は、それぞれ半分ずつ補完された実数を持ちます。
    background-repeat 不可
    background-size 可。length または percentage, calc();の反復可能リストの単純なリスト形式 の値として補完します。両方の値が length の場合は、length 値として補完されます。両方の値が percentage の場合は、percentage 値として補完されます。それ以外の場合は、両方の値が calc() 関数にコンバートされ、length と percentage の合計になります (または各値が 0)。そして、これらの calc() 関数は、それぞれ半分ずつ補完された実数を持ちます。これは、keyword 値がアニメーション不可であることを意味します。
    border 以下の各プロパティのショートハンドとして補完します:
    • border-color: 以下の各プロパティのショートハンドとして補完します:
      • border-bottom-color: 可。color の値として補完します。
      • border-left-color: 可。color の値として補完します。
      • border-right-color: 可。color の値として補完します。
      • border-top-color: 可。color の値として補完します。
    • border-style: 不可
    • border-width: 以下の各プロパティのショートハンドとして補完します:
      • border-bottom-width: 可。length の値として補完します。
      • border-left-width: 可。length の値として補完します。
      • border-right-width: 可。length の値として補完します。
      • border-top-width: 可。length の値として補完します。
    border-bottom 以下の各プロパティのショートハンドとして補完します:
    • border-bottom-color: 可。color の値として補完します。
    • border-bottom-style: 不可
    • border-bottom-width: 可。length の値として補完します。
    border-bottom-color 可。color の値として補完します。
    border-bottom-left-radius 可。length または percentage, calc(); の値として補完します。両方の値が length の場合は、length 値として補完されます。両方の値が percentage の場合は、percentage 値として補完されます。それ以外の場合は、両方の値が calc() 関数にコンバートされ、length と percentage の合計になります (または各値が 0)。そして、これらの calc() 関数は、それぞれ半分ずつ補完された実数を持ちます。
    border-bottom-right-radius 可。length または percentage, calc(); の値として補完します。両方の値が length の場合は、length 値として補完されます。両方の値が percentage の場合は、percentage 値として補完されます。それ以外の場合は、両方の値が calc() 関数にコンバートされ、length と percentage の合計になります (または各値が 0)。そして、これらの calc() 関数は、それぞれ半分ずつ補完された実数を持ちます。
    border-bottom-style 不可
    border-bottom-width 可。length の値として補完します。
    border-color 以下の各プロパティのショートハンドとして補完します:
    • border-bottom-color: 可。color の値として補完します。
    • border-left-color: 可。color の値として補完します。
    • border-right-color: 可。color の値として補完します。
    • border-top-color: 可。color の値として補完します。
    border-image 不可
    border-image-outset 不可
    border-image-repeat 不可
    border-image-slice 不可
    border-image-source 不可
    border-image-width 不可
    border-left 以下の各プロパティのショートハンドとして補完します:
    • border-left-color: 可。color の値として補完します。
    • border-left-style: 不可
    • border-left-width: 可。length の値として補完します。
    border-left-color 可。color の値として補完します。
    border-left-style 不可
    border-left-width 可。length の値として補完します。
    border-radius 以下の各プロパティのショートハンドとして補完します:
    • border-top-left-radius: 可。length または percentage, calc(); の値として補完します。両方の値が length の場合は、length 値として補完されます。両方の値が percentage の場合は、percentage 値として補完されます。それ以外の場合は、両方の値が calc() 関数にコンバートされ、length と percentage の合計になります (または各値が 0)。そして、これらの calc() 関数は、それぞれ半分ずつ補完された実数を持ちます。
    • border-top-right-radius: 可。length または percentage, calc(); の値として補完します。両方の値が length の場合は、length 値として補完されます。両方の値が percentage の場合は、percentage 値として補完されます。それ以外の場合は、両方の値が calc() 関数にコンバートされ、length と percentage の合計になります (または各値が 0)。そして、これらの calc() 関数は、それぞれ半分ずつ補完された実数を持ちます。
    • border-bottom-right-radius: 可。length または percentage, calc(); の値として補完します。両方の値が length の場合は、length 値として補完されます。両方の値が percentage の場合は、percentage 値として補完されます。それ以外の場合は、両方の値が calc() 関数にコンバートされ、length と percentage の合計になります (または各値が 0)。そして、これらの calc() 関数は、それぞれ半分ずつ補完された実数を持ちます。
    • border-bottom-left-radius: 可。length または percentage, calc(); の値として補完します。両方の値が length の場合は、length 値として補完されます。両方の値が percentage の場合は、percentage 値として補完されます。それ以外の場合は、両方の値が calc() 関数にコンバートされ、length と percentage の合計になります (または各値が 0)。そして、これらの calc() 関数は、それぞれ半分ずつ補完された実数を持ちます。
    border-right 以下の各プロパティのショートハンドとして補完します:
    • border-right-color: 可。color の値として補完します。
    • border-right-style: 不可
    • border-right-width: 可。length の値として補完します。
    border-right-color 可。color の値として補完します。
    border-right-style 不可
    border-right-width 可。length の値として補完します。
    border-style 不可
    border-top 以下の各プロパティのショートハンドとして補完します:
    • border-top-color: 可。color の値として補完します。
    • border-top-style: 不可
    • border-top-width: 可。length の値として補完します。
    border-top-color 可。color の値として補完します。
    border-top-left-radius 可。length または percentage, calc(); の値として補完します。両方の値が length の場合は、length 値として補完されます。両方の値が percentage の場合は、percentage 値として補完されます。それ以外の場合は、両方の値が calc() 関数にコンバートされ、length と percentage の合計になります (または各値が 0)。そして、これらの calc() 関数は、それぞれ半分ずつ補完された実数を持ちます。
    border-top-right-radius 可。length または percentage, calc(); の値として補完します。両方の値が length の場合は、length 値として補完されます。両方の値が percentage の場合は、percentage 値として補完されます。それ以外の場合は、両方の値が calc() 関数にコンバートされ、length と percentage の合計になります (または各値が 0)。そして、これらの calc() 関数は、それぞれ半分ずつ補完された実数を持ちます。
    border-top-style 不可
    border-top-width 可。length の値として補完します。
    border-width 以下の各プロパティのショートハンドとして補完します:
    • border-bottom-width: 可。length の値として補完します。
    • border-left-width: 可。length の値として補完します。
    • border-right-width: 可。length の値として補完します。
    • border-top-width: 可。length の値として補完します。
    Box Model
    プロパティ アニメーションの可否
    box-decoration-break 不可
    box-shadow 可。shadow リスト の値として補完します。
    margin 可。length の値として補完します。
    margin-bottom 可。length の値として補完します。
    margin-left 可。length の値として補完します。
    margin-right 可。length の値として補完します。
    margin-top 可。length の値として補完します。
    padding 可。length の値として補完します。
    padding-bottom 可。length の値として補完します。
    padding-left 可。length の値として補完します。
    padding-right 可。length の値として補完します。
    padding-top 可。length の値として補完します。
    box-sizing 不可
    max-height 可。length または percentage, calc(); の値として補完します。両方の値が length の場合は、length 値として補完されます。両方の値が percentage の場合は、percentage 値として補完されます。それ以外の場合は、両方の値が calc() 関数にコンバートされ、length と percentage の合計になります (または各値が 0)。そして、これらの calc() 関数は、それぞれ半分ずつ補完された実数を持ちます。
    min-height 可。length または percentage, calc(); の値として補完します。両方の値が length の場合は、length 値として補完されます。両方の値が percentage の場合は、percentage 値として補完されます。それ以外の場合は、両方の値が calc() 関数にコンバートされ、length と percentage の合計になります (または各値が 0)。そして、これらの calc() 関数は、それぞれ半分ずつ補完された実数を持ちます。
    height 可。length または percentage, calc(); の値として補完します。両方の値が length の場合は、length 値として補完されます。両方の値が percentage の場合は、percentage 値として補完されます。それ以外の場合は、両方の値が calc() 関数にコンバートされ、length と percentage の合計になります (または各値が 0)。そして、これらの calc() 関数は、それぞれ半分ずつ補完された実数を持ちます。
    max-width 可。length または percentage, calc(); の値として補完します。両方の値が length の場合は、length 値として補完されます。両方の値が percentage の場合は、percentage 値として補完されます。それ以外の場合は、両方の値が calc() 関数にコンバートされ、length と percentage の合計になります (または各値が 0)。そして、これらの calc() 関数は、それぞれ半分ずつ補完された実数を持ちます。
    min-width 可。length または percentage, calc(); の値として補完します。両方の値が length の場合は、length 値として補完されます。両方の値が percentage の場合は、percentage 値として補完されます。それ以外の場合は、両方の値が calc() 関数にコンバートされ、length と percentage の合計になります (または各値が 0)。そして、これらの calc() 関数は、それぞれ半分ずつ補完された実数を持ちます。
    width 可。length または percentage, calc(); の値として補完します。両方の値が length の場合は、length 値として補完されます。両方の値が percentage の場合は、percentage 値として補完されます。それ以外の場合は、両方の値が calc() 関数にコンバートされ、length と percentage の合計になります (または各値が 0)。そして、これらの calc() 関数は、それぞれ半分ずつ補完された実数を持ちます。
    overflow 不可
    overflow-x 不可
    overflow-y 不可
    visibility 可。visibility の値として補完します。
    Table
    プロパティ アニメーションの可否
    border-collapse 不可
    border-spacing 不可
    caption-side 不可
    empty-cells 不可
    table-layout 不可
    vertical-align 可。length の値として補完します。
    Positioning
    プロパティ アニメーションの可否
    bottom 可。length または percentage, calc(); の値として補完します。両方の値が length の場合は、length 値として補完されます。両方の値が percentage の場合は、percentage 値として補完されます。それ以外の場合は、両方の値が calc() 関数にコンバートされ、length と percentage の合計になります (または各値が 0)。そして、これらの calc() 関数は、それぞれ半分ずつ補完された実数を持ちます。
    left 可。length または percentage, calc(); の値として補完します。両方の値が length の場合は、length 値として補完されます。両方の値が percentage の場合は、percentage 値として補完されます。それ以外の場合は、両方の値が calc() 関数にコンバートされ、length と percentage の合計になります (または各値が 0)。そして、これらの calc() 関数は、それぞれ半分ずつ補完された実数を持ちます。
    right 可。length または percentage, calc(); の値として補完します。両方の値が length の場合は、length 値として補完されます。両方の値が percentage の場合は、percentage 値として補完されます。それ以外の場合は、両方の値が calc() 関数にコンバートされ、length と percentage の合計になります (または各値が 0)。そして、これらの calc() 関数は、それぞれ半分ずつ補完された実数を持ちます。
    top 可。length または percentage, calc(); の値として補完します。両方の値が length の場合は、length 値として補完されます。両方の値が percentage の場合は、percentage 値として補完されます。それ以外の場合は、両方の値が calc() 関数にコンバートされ、length と percentage の合計になります (または各値が 0)。そして、これらの calc() 関数は、それぞれ半分ずつ補完された実数を持ちます。
    float 不可
    clear 不可
    position 不可
    z-index 可。integer の値として補完します。
    Fonts
    プロパティ アニメーションの可否
    font 以下の各プロパティのショートハンドとして補完します:
    • font-style: 不可
    • font-variant: 不可
    • font-weight: 可。font weight の値として補完します。
    • font-stretch: 可。font stretch の値として補完します。
    • font-size: 可。length の値として補完します。
    • line-height: 可。number, length の値として補完します。
    • font-family: 不可
    font-family 不可
    font-variant 不可
    font-weight 可。font weight の値として補完します。
    font-stretch 可。font stretch の値として補完します。
    font-size 可。length の値として補完します。
    line-height 可。number, length の値として補完します。
    font-feature-settings 不可
    font-size-adjust 可。number の値として補完します。
    font-style 不可
    Images
    プロパティ アニメーションの可否
    image-rendering 不可
    image-orientation 不可
    Counters & Lists
    プロパティ アニメーションの可否
    counter-increment 不可
    counter-reset 不可
    list-style 不可
    list-style-image 不可
    list-style-position 不可
    list-style-type 不可
    Page
    プロパティ アニメーションの可否
    orphans 不可
    page-break-after 不可
    page-break-before 不可
    page-break-inside 不可
    widows 不可
    User interface
    プロパティ アニメーションの可否
    outline 以下の各プロパティのショートハンドとして補完します:
    • outline-color: 可。color の値として補完します。
    • outline-width: 可。length の値として補完します。
    • outline-style: 不可
    outline-color 可。color の値として補完します。
    outline-width 可。length の値として補完します。
    outline-style 不可
    outline-offset 可。length の値として補完します。
    cursor 不可
    resize 不可
    text-overflow 不可
    Generated content
    プロパティ アニメーションの可否
    content 不可
    quotes 不可
    Miscellaneous
    プロパティ アニメーションの可否
    clip 可。rectangle の値として補完します。
    display 不可
    unicode-bidi 不可
    ime-mode 不可

     

    ドキュメントのタグと貢献者

    Contributors to this page: Marsf, ethertank
    最終更新者: ethertank,