সিএসএস অ্যানিমেসনকৃত - Css Animatable



সিএসএস অ্যানিমেসনকৃত - Css Animatable উদাহরণ

কিছু সিএসএস প্রোপার্টি animatable অর্থাৎ এদেরকে এনিমেশন ও ট্রানজিশন করা যায়। আকার, সংখ্যা, শতকরা, রঙ এর মত animatable প্রোপার্টিগুলোকেও এক মান থেকে অন্য মানে পরিবর্তন করা যায়।


ওপরের উদাহরণটির জন্য নিচের কোড গুলো দেখুন।

উদাহরণ

/* Code for old Chrome, Safari and Opera */
@-webkit-keyframes mymove {
from {background-color: blue;}
to {background-color: red;}
}

/* Standard syntax */
@keyframes mymove {
from {background-color: blue;}
to {background-color: red;}
}




ব্রাউজার সাপোর্ট

টেবিলে দেয়া রোগুলোর প্রথম লাইন ব্রাউজারের সেই প্রথম ভার্সন নির্দেশ করে যেগুলো পুরোপুরি এই প্রপার্টি সাপোর্ট করে। এছাড়াও এর পরের লাইন -webkit- বা -moz- যুক্ত ভার্সন গুলো নির্দেশ করে ব্রাউজারের ঐ প্রথম ভার্সন যেগুলো প্রিফিক্স ব্যবহার করে প্রদর্শিত হতে পারে।

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-


সিএসএস অ্যানিমেসনকৃত - Css Animatable প্রপার্টি

নিচে সিএসএস এর Animatable প্রপার্টি গুলোর নাম দেখুন।

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
height
left
letter-spacing
line-height
margin
margin-bottom
margin-left
margin-right
margin-top
max-height
max-width
min-height
min-width
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






এই ওয়েব সাইট এর সমস্ত টিউটোরিয়াল, সার্কিট ডায়াগ্রাম, উদাহরণ ইত্যাদি খুব সহজ ও সাধারণ ভাবে তৈরি করা হয়েছে। টিউটোরিয়াল, সার্কিট ডায়াগ্রাম, উদাহরণ ইত্যাদির ভুল পরিহার করার জন্য বার বার যাচাই করা হয়েছে, কিন্তু আমরা এর পূর্ণ নিশ্চয়তা ও দায়ভার বহন করি না। যখন আপনি এই সাইটটি ব্যবহার করেন, আমরা ধরে নেই যে আপনি পড়েছেন এবং সম্মত আছেন আমাদের টার্মস অফ ইউস (Terms of use) এবং প্রাইভেসি পলিসি( Privacy policy) সম্পর্কে।

Report or suggest about this page

Copyright 2016-2018 by websschool.com, All Rights Reserved.