Curriculum
Course: HTML Mastery: From Basics to Brilliance
Login

Curriculum

HTML Mastery: From Basics to Brilliance

মডিউল ১: পরিচিতি এবং বেসিক HTML : 2. HTML ডকুমেন্ট স্ট্রাকচার

0/2

মডিউল ১: পরিচিতি এবং বেসিক HTML : 4. টেক্সট ফরম্যাটিং ট্যাগস

0/3
Text lesson

লাইন ব্রেক (<br>) এবং হরাইজন্টাল লাইন (<hr>)

HTML-এ লাইন ব্রেক (<br>) এবং হরাইজন্টাল লাইন (<hr>) হলো দুটি গুরুত্বপূর্ণ ট্যাগ যা কনটেন্টের ভিজ্যুয়াল গঠন তৈরি করতে ব্যবহৃত হয়।


1. লাইন ব্রেক (<br>)

<br> ট্যাগ একটি নতুন লাইন শুরু করার জন্য ব্যবহৃত হয়। এটি একটি সেল্ফ-ক্লোজিং ট্যাগ এবং এতে কোনো ক্লোজিং ট্যাগ লাগে না।

বৈশিষ্ট্য:

  • এটি ব্লক লেভেল এলিমেন্ট নয়।
  • এটি প্যারাগ্রাফ বা টেক্সটের মধ্যে লাইন পরিবর্তন করে।

উদাহরণ:

<p>This is the first line.<br>This is the second line.</p>

আউটপুট:
This is the first line.
This is the second line.


2. হরাইজন্টাল লাইন (<hr>)

<hr> ট্যাগ একটি অনুভূমিক রেখা তৈরি করতে ব্যবহৃত হয়। এটি সাধারণত কনটেন্টের মধ্যে ভিজ্যুয়াল বিভাজক (divider) হিসেবে কাজ করে।

বৈশিষ্ট্য:

  • এটি একটি সেল্ফ-ক্লোজিং ট্যাগ।
  • এটি ব্লক লেভেল এলিমেন্ট এবং পুরো উইডথ ধরে।
  • এটি কনটেন্টের একটি অংশকে অন্য অংশ থেকে আলাদা করে।

উদাহরণ:

<h1>Welcome to My Website</h1>
<hr>
<p>This is the first section of content.</p>
<hr>
<p>This is the second section of content.</p>

আউটপুট:

  • একটি হেডিং এর পরে এবং দুই প্যারাগ্রাফের মধ্যে অনুভূমিক রেখা প্রদর্শিত হবে।

স্টাইলিং CSS দিয়ে:

লাইন ব্রেক (<br>) স্টাইলিং:

<br> ট্যাগ নিজে স্টাইল করা যায় না, তবে এর চারপাশের টেক্সট কাস্টমাইজ করা যায়।

হরাইজন্টাল লাইন (<hr>) স্টাইলিং:

CSS ব্যবহার করে <hr> এর ডিজাইন পরিবর্তন করা যায়।

<style>
hr {
border: none;
height: 2px;
background-color: #4CAF50;
margin: 20px 0;
}
</style>

সমন্বিত উদাহরণ:

<!DOCTYPE html>
<html>
<head>
<title>Line Break and Horizontal Line</title>
<style>
hr {
border: none;
height: 3px;
background-color: blue;
margin: 10px 0;
}
</style>
</head>
<body>
<p>This is the first paragraph.<br>This is a new line in the same paragraph.</p>
<hr>
<p>This is a second paragraph after the horizontal line.</p>
</body>
</html>

 

  • <br> ট্যাগ ব্যবহার করা হয় টেক্সটের মধ্যে লাইন পরিবর্তন করতে।
  • <hr> ট্যাগ ব্যবহার করা হয় একটি অংশকে অন্য অংশ থেকে আলাদা করতে।
  • উভয় ট্যাগই খুব সহজ এবং কনটেন্টের ভিজ্যুয়াল গঠন উন্নত করতে অত্যন্ত কার্যকর।