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

CSS দিয়ে <img> বা <video> কন্টেইনারে ফিট করতে রিসাইজ করুন


ছবি বা ভিডিও কন্টেইনারে ফিট করতে রিসাইজ করতে CSS-এ object-fit প্রপার্টি ব্যবহার করুন।

উদাহরণ

এটি অর্জন করতে নিচের কোডটি চালাতে পারেন:

<!DOCTYPE html> <html>    <head>       <style>          .myimg {             width:250px;             height:350px;             object-fit:fill;          }       </style>    </head>    <body>       <h2>SWIFT</h2>       <img class = "myimg" src = "https://www.tutorialspoint.com/assets/videos/courses/67/images/course_67_image.png"          alt = "Python Data Science" width = "300" height = "200">    </body> </html>

  1. CSS দিয়ে স্ক্রোলবার লুকানো

  2. CSS দিয়ে অ্যারো (Arrow) তৈরি

  3. CSS Flex দিয়ে উপাদানকে কন্টেইনারের নিচে পজিশন করা

  4. CSS object-fit ও object-position ব্যবহার করে ইমেজ ক্রপ করা