কম্পিউটার

HTML পৃষ্ঠায় ভাসমান চিত্র কীভাবে ব্যবহার করবেন?


HTML এ একটি ভাসমান চিত্র ব্যবহার করতে, CSS প্রপার্টি ফ্লোট ব্যবহার করুন৷ এটি আপনাকে বাম বা ডানে একটি চিত্র ভাসতে দেয়। আরো সম্পত্তি মান নিম্নলিখিত অন্তর্ভুক্ত:

Sr. No.
সম্পত্তির মান ও বিবরণ
1
কোনটিই নয়
ভাসানো হয়নি
2
বামে
বাম দিকে ভাসছে
3
ডান
ডানদিকে ভাসছে
4
প্রাথমিক
ডিফল্ট মান

HTML পৃষ্ঠায় ভাসমান চিত্র কীভাবে ব্যবহার করবেন?

উদাহরণ

আপনি HTML এ ভাসমান চিত্র ব্যবহার করতে নিম্নলিখিত কোডটি চালানোর চেষ্টা করতে পারেন৷ এখানে ফ্লোট রাইট এবং ফ্লোট বাম CSS অ্যাট্রিবিউটের ব্যবহার

<!DOCTYPE html>
<html>
   <head>
      <title>HTML Floating Image</title>
   </head>

<body>
   <h1>Float Right</h1>
   <p>The below image floats to the right.</p>
   <p>
      <img src="https://www.tutorialspoint.com/green/images/logo.png" style="float:right" width="190" height="84" />
      This is demo text. This is demo text.
      This is demo text. This is demo text.
      This is demo text. This is demo text.
      This is demo text. This is demo text.
      This is demo text. This is demo text.
      This is demo text. This is demo text.
      This is demo text. This is demo text.
      This is demo text. This is demo text.
   </p>
   <h1>Float Left</h1>
      <p>The below image floats to the left.</p>
      <p>
         <img src="https://www.tutorialspoint.com/green/images/logo.png" style="float:left" width="190" height="84" />
         This is demo text. This is demo text.
         This is demo text. This is demo text.
         This is demo text. This is demo text.
         This is demo text. This is demo text.
         This is demo text. This is demo text.
         This is demo text. This is demo text.
         This is demo text. This is demo text.
         This is demo text. This is demo text.
      </p>
   </body>
</html>

আউটপুট

HTML পৃষ্ঠায় ভাসমান চিত্র কীভাবে ব্যবহার করবেন?


  1. কিভাবে HTML এ একটি ছবিকে প্রতিক্রিয়াশীল করা যায়?

  2. HTML এ ব্লককোট কিভাবে ব্যবহার করবেন?

  3. কিভাবে HTML এ একটি লিঙ্ক হিসাবে একটি ছবি ব্যবহার করবেন?

  4. কিভাবে HTML পৃষ্ঠায় একটি অ্যানিমেটেড ছবি ব্যবহার করবেন?