কম্পিউটার

কিভাবে CSS দিয়ে একটি প্রতিক্রিয়াশীল ছবি তৈরি করবেন?


CSS -

এর সাথে একটি প্রতিক্রিয়াশীল চিত্র তৈরি করার কোডটি অনুসরণ করা হয়েছে

উদাহরণ

<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
img {
   width: 100%;
   max-width: 1000px;
}
</style>
</head>
<body>
<h1>Responsive Images Example</h1>
<h2>Resize the window to see responsive image scale up and down</h2>
<img src="https://images.pexels.com/photos/34950/pexels-photo.jpg?auto=compress&cs=tinysrgb&dpr=2&h=650&w=940">
</body>
</html>

আউটপুট

উপরের কোডটি নিম্নলিখিত আউটপুট −

তৈরি করবে

কিভাবে CSS দিয়ে একটি প্রতিক্রিয়াশীল ছবি তৈরি করবেন?

ব্রাউজার রিসাইজ করার সময় ইমেজটি নিচের মত স্কেল হবে -

কিভাবে CSS দিয়ে একটি প্রতিক্রিয়াশীল ছবি তৈরি করবেন?


  1. কিভাবে CSS দিয়ে প্রতিক্রিয়াশীল ভাসমান উপাদান তৈরি করবেন?

  2. কিভাবে CSS দিয়ে তীর তৈরি করবেন?

  3. কিভাবে CSS দিয়ে প্রতিক্রিয়াশীল প্রশংসাপত্র তৈরি করবেন?

  4. কিভাবে CSS দিয়ে একটি প্রতিক্রিয়াশীল ব্লগ লেআউট তৈরি করবেন?