কম্পিউটার টিউটোরিয়াল

CSS3-এ x-axis, y-axis এবং z-axis ব্যবহার করে এলিমেন্ট রূপান্তর করুন


এলিমেন্টকে x-axis, y-axis এবং z-axis দিয়ে রূপান্তর করতে translate3d(x,y,z) মেথড ব্যবহার করুন।

সিনট্যাক্স

translate3d(tx, ty, tz)


tx: এটি একটি <length> যা ট্রান্সলেটিং ভেক্টরের abcissa উপস্থাপন করে।
ty: এটি একটি <length> যা ট্রান্সলেটিং ভেক্টরের ordinate উপস্থাপন করে।
tz: এটি একটি <length> যা ট্রান্সলেটিং ভেক্টরের z-কম্পোনেন্ট উপস্থাপন করে।
নিচে একটি উদাহরণ দেওয়া হলো:

div {   width: 50px;   height: 50px;   background-color: orange; } .trans {   transform: perspective(300px) translate3d(15px, 0, 0px);   background-color: black; }

  1. CSS3-এ z-axis ব্যবহার করে এলিমেন্ট রোটেট ট্রান্সফর্ম করুন

  2. CSS3 দিয়ে ইমেজ কন্ট্রাস্ট সমজস্ত করা

  3. CSS3 ২D ট্রান্সফর্ম ফাংশন (Transform Functions) ব্যবহার

  4. CSS3 লিনিয়ার এবং রেডিয়াল গ্রেডিয়েন্ট ব্যবহার