CSS অ্যানিমেশন সংক্রান্ত প্রোপার্টি

সংজ্ঞা ও ব্যবহার

কিছু CSS এট্রিবিউট অ্যানিমেশন তৈরিতে ব্যবহার করা যেতে পারে, যার মানে তারা ট্রানজিশন ইফেক্টের মতো অ্যানিমেশনেও ব্যবহার করা যেতে পারে。

অ্যানিমেশন সেট করার জন্য সম্ভব এট্রিবিউটগুলি একটি মান থেকে আরেকটি মান পর্যন্ত ক্রমাগত পরিবর্তন করা যেতে পারে, যেমন মাপ, সংখ্যা, শতকরা এবং রঙ。

ব্রাউজার সমর্থন

তালিকায় উল্লিখিত সংখ্যা পূর্ণাত্মকভাবে CSS অ্যানিমেশন সমর্থনকারী প্রথম ব্রাউজার সংস্করণটির উল্লেখ করেছে。

প্রথম সংস্করণটির প্রয়োগের জন্য -webkit-、-moz- অথবা -o- পরের সংখ্যা উল্লেখ করা হয়েছে。

43.0
4.0 -webkit-
10.0 16.0
5.0 -moz-
9.0
4.0 -webkit-
30.0
15.0 -webkit-
12.0 -o-

উদাহরণ

ব্ল্যাককার রঙ থেকে ব্লু রঙ পর্যন্ত পটভূমির রঙ অ্যানিমেশন সেট করুন:

@keyframes mymove {
  from {background-color: red;}
  to {background-color: blue;}
{}

স্বয়ংক্রিয়ভাবে প্রয়োগ করুন

অ্যানিমেশন-সংক্রান্ত এট্রিবিউট

তালিকায় উল্লিখিত হলো CSS-তে অ্যানিমেশন-সংক্রান্ত এট্রিবিউটগুলি:

属性 TIY
background চেষ্টা করুন
background-color চেষ্টা করুন
background-position চেষ্টা করুন
background-size চেষ্টা করুন
border চেষ্টা করুন
border-bottom চেষ্টা করুন
border-bottom-color চেষ্টা করুন
border-bottom-left-radius চেষ্টা করুন
border-bottom-right-radius চেষ্টা করুন
border-bottom-width চেষ্টা করুন
border-color চেষ্টা করুন
border-left চেষ্টা করুন
border-left-color চেষ্টা করুন
border-left-width চেষ্টা করুন
border-right চেষ্টা করুন
border-right-color চেষ্টা করুন
border-right-width চেষ্টা করুন
border-spacing চেষ্টা করুন
border-top চেষ্টা করুন
border-top-color চেষ্টা করুন
border-top-left-radius চেষ্টা করুন
border-top-right-radius চেষ্টা করুন
border-top-width চেষ্টা করুন
bottom চেষ্টা করুন
box-shadow চেষ্টা করুন
clip চেষ্টা করুন
color চেষ্টা করুন
column-count চেষ্টা করুন
column-gap চেষ্টা করুন
column-rule চেষ্টা করুন
column-rule-color চেষ্টা করুন
column-rule-width চেষ্টা করুন
column-width চেষ্টা করুন
columns চেষ্টা করুন
filter চেষ্টা করুন
flex চেষ্টা করুন
flex-basis চেষ্টা করুন
flex-grow চেষ্টা করুন
flex-shrink চেষ্টা করুন
font চেষ্টা করুন
font-size চেষ্টা করুন
font-size-adjust
font-stretch
font-weight চেষ্টা করুন
grid চেষ্টা করুন
grid-area চেষ্টা করুন
grid-auto-columns চেষ্টা করুন
grid-auto-flow চেষ্টা করুন
grid-auto-rows চেষ্টা করুন
grid-column চেষ্টা করুন
grid-column-end চেষ্টা করুন
grid-column-gap চেষ্টা করুন
grid-column-start চেষ্টা করুন
grid-gap চেষ্টা করুন
grid-row চেষ্টা করুন
grid-row-end চেষ্টা করুন
grid-row-gap চেষ্টা করুন
grid-row-start চেষ্টা করুন
grid-template চেষ্টা করুন
grid-template-areas চেষ্টা করুন
grid-template-columns চেষ্টা করুন
grid-template-rows চেষ্টা করুন
height চেষ্টা করুন
left চেষ্টা করুন
letter-spacing চেষ্টা করুন
line-height চেষ্টা করুন
margin চেষ্টা করুন
margin-bottom চেষ্টা করুন
margin-left চেষ্টা করুন
margin-right চেষ্টা করুন
margin-top চেষ্টা করুন
max-height চেষ্টা করুন
max-width চেষ্টা করুন
min-height চেষ্টা করুন
min-width চেষ্টা করুন
object-position চেষ্টা করুন
opacity চেষ্টা করুন
order চেষ্টা করুন
outline চেষ্টা করুন
outline-color চেষ্টা করুন
outline-offset চেষ্টা করুন
outline-width চেষ্টা করুন
padding চেষ্টা করুন
padding-bottom চেষ্টা করুন
padding-left চেষ্টা করুন
padding-right চেষ্টা করুন
padding-top চেষ্টা করুন
perspective চেষ্টা করুন
perspective-origin চেষ্টা করুন
right চেষ্টা করুন
text-decoration-color চেষ্টা করুন
text-indent চেষ্টা করুন
text-shadow চেষ্টা করুন
top চেষ্টা করুন
transform চেষ্টা করুন
transform-origin চেষ্টা করুন
vertical-align চেষ্টা করুন
visibility
width চেষ্টা করুন
word-spacing চেষ্টা করুন
z-index চেষ্টা করুন