Sertifikat olingYANGIW3Schools ilovasiiOS va AndroidSarguzashtni boshlang

CSS animatsiya qilinadigan xususiyatlar

ULASHISH

Ta’rif va qo‘llanilishi

Ba’zi CSS xususiyatlari animatsiya qilinadigan (animatable) bo‘ladi, ya’ni ulardan animatsiyalar va o‘tishlarda (transitions) foydalanish mumkin.

Animatsiya qilinadigan xususiyatlar bir qiymatdan boshqasiga asta-sekin o‘zgarishi mumkin, masalan, o‘lcham, sonlar, foiz va rang.

Brauzerlarda qo‘llab-quvvatlash

Animatsiya xususiyatlari barcha zamonaviy brauzerlarda qo‘llab-quvvatlanadi.

Jadvaldagi sonlar CSS animatsiyalarini to‘liq qo‘llab-quvvatlaydigan birinchi brauzer versiyasini ko‘rsatadi.

43 10 16 9 30

Misol

background-color qiymatini qizildan ko‘kka animatsiya qiling:

@keyframes mymove {   from {background-color: red;}   to {background-color: blue;} }
O‘zingiz sinab ko‘ring »

Animatsiya qilinadigan xususiyatlar

Quyidagi xususiyatlar CSS’da animatsiya qilinadigan xususiyatlardir:

Xususiyat
aspect-ratioSinab ko‘ring
backgroundSinab ko‘ring
background-colorSinab ko‘ring
background-positionSinab ko‘ring
background-position-xSinab ko‘ring
background-position-ySinab ko‘ring
background-sizeSinab ko‘ring
block-sizeSinab ko‘ring
borderSinab ko‘ring
border-bottomSinab ko‘ring
border-bottom-colorSinab ko‘ring
border-end-end-radiusSinab ko‘ring
border-end-start-radiusSinab ko‘ring
border-blockSinab ko‘ring
border-block-colorSinab ko‘ring
border-block-end-colorSinab ko‘ring
border-block-end-widthSinab ko‘ring
border-block-start-colorSinab ko‘ring
border-block-start-widthSinab ko‘ring
border-block-widthSinab ko‘ring
border-bottom-left-radiusSinab ko‘ring
border-bottom-right-radiusSinab ko‘ring
border-inlineSinab ko‘ring
border-inline-colorSinab ko‘ring
border-inline-end-colorSinab ko‘ring
border-inline-end-widthSinab ko‘ring
border-inline-start-colorSinab ko‘ring
border-inline-start-widthSinab ko‘ring
border-inline-widthSinab ko‘ring
border-start-end-radiusSinab ko‘ring
border-start-start-radiusSinab ko‘ring
border-bottom-widthSinab ko‘ring
border-colorSinab ko‘ring
border-leftSinab ko‘ring
border-left-colorSinab ko‘ring
border-left-widthSinab ko‘ring
border-rightSinab ko‘ring
border-right-colorSinab ko‘ring
border-right-widthSinab ko‘ring
border-spacingSinab ko‘ring
border-topSinab ko‘ring
border-top-colorSinab ko‘ring
border-top-left-radiusSinab ko‘ring
border-top-right-radiusSinab ko‘ring
border-top-widthSinab ko‘ring
bottomSinab ko‘ring
box-shadowSinab ko‘ring
clipSinab ko‘ring
colorSinab ko‘ring
column-countSinab ko‘ring
column-gapSinab ko‘ring
column-ruleSinab ko‘ring
column-rule-colorSinab ko‘ring
column-rule-widthSinab ko‘ring
column-widthSinab ko‘ring
columnsSinab ko‘ring
filterSinab ko‘ring
flexSinab ko‘ring
flex-basisSinab ko‘ring
flex-growSinab ko‘ring
flex-shrinkSinab ko‘ring
fontSinab ko‘ring
font-sizeSinab ko‘ring
font-size-adjust
font-stretch
font-weightSinab ko‘ring
gridSinab ko‘ring
grid-areaSinab ko‘ring
grid-auto-columnsSinab ko‘ring
grid-auto-flowSinab ko‘ring
grid-auto-rowsSinab ko‘ring
grid-columnSinab ko‘ring
grid-column-endSinab ko‘ring
grid-column-gapSinab ko‘ring
grid-column-startSinab ko‘ring
grid-gapSinab ko‘ring
grid-rowSinab ko‘ring
grid-row-endSinab ko‘ring
grid-row-gapSinab ko‘ring
grid-row-startSinab ko‘ring
grid-templateSinab ko‘ring
grid-template-areasSinab ko‘ring
grid-template-columnsSinab ko‘ring
grid-template-rowsSinab ko‘ring
heightSinab ko‘ring
inline-sizeSinab ko‘ring
insetSinab ko‘ring
inset-blockSinab ko‘ring
inset-block-endSinab ko‘ring
inset-block-startSinab ko‘ring
inset-inlineSinab ko‘ring
inset-inline-endSinab ko‘ring
inset-inline-startSinab ko‘ring
leftSinab ko‘ring
letter-spacingSinab ko‘ring
line-heightSinab ko‘ring
marginSinab ko‘ring
margin-blockSinab ko‘ring
margin-block-endSinab ko‘ring
margin-block-startSinab ko‘ring
margin-bottomSinab ko‘ring
margin-inlineSinab ko‘ring
margin-inline-endSinab ko‘ring
margin-inline-startSinab ko‘ring
margin-leftSinab ko‘ring
margin-rightSinab ko‘ring
margin-topSinab ko‘ring
max-heightSinab ko‘ring
max-widthSinab ko‘ring
max-block-sizeSinab ko‘ring
max-inline-sizeSinab ko‘ring
min-block-sizeSinab ko‘ring
min-inline-sizeSinab ko‘ring
min-heightSinab ko‘ring
min-widthSinab ko‘ring
object-positionSinab ko‘ring
offset-anchorSinab ko‘ring
offset-distanceSinab ko‘ring
offset-pathSinab ko‘ring
offset-rotateSinab ko‘ring
opacitySinab ko‘ring
orderSinab ko‘ring
outlineSinab ko‘ring
outline-colorSinab ko‘ring
outline-offsetSinab ko‘ring
outline-widthSinab ko‘ring
paddingSinab ko‘ring
padding-blockSinab ko‘ring
padding-block-endSinab ko‘ring
padding-block-startSinab ko‘ring
padding-bottomSinab ko‘ring
padding-inlineSinab ko‘ring
padding-inline-endSinab ko‘ring
padding-inline-startSinab ko‘ring
padding-leftSinab ko‘ring
padding-rightSinab ko‘ring
padding-topSinab ko‘ring
perspectiveSinab ko‘ring
perspective-originSinab ko‘ring
rightSinab ko‘ring
rotateSinab ko‘ring
scaleSinab ko‘ring
text-decoration-colorSinab ko‘ring
text-indentSinab ko‘ring
text-shadowSinab ko‘ring
topSinab ko‘ring
transformSinab ko‘ring
transform-originSinab ko‘ring
translateSinab ko‘ring
vertical-alignSinab ko‘ring
visibility
widthSinab ko‘ring
word-spacingSinab ko‘ring
z-indexSinab ko‘ring


‹ OrqagaKeyingisi

W3Schools Pathfinder

Yutuqlaringizni kuzating – bu bepul!

Ro'yxatdan o'tishKirish