এইচটিএমএল <hr> ট্যাগ
<hr> ট্যাগের ব্রাউজার সাপোর্ট
| এলিমেন্ট | Google Chrome | Edge/IE | Mozila Firefox | Safari | Opera |
|---|---|---|---|---|---|
<hr> |
সকল ভার্সন | সকল ভার্সন | সকল ভার্সন | সকল ভার্সন | সকল ভার্সন |
সংজ্ঞা ও ব্যবহার
একটি ওয়েবপেজের মধ্যে অনেক ধরনের কন্টেন্ট থাকে। কোন কোন ক্ষেত্রে একটি কন্টেন্ট থেকে অন্য কন্টেন্টটি সম্পূর্ণ আলাদা হয়। এক্ষেত্রে <hr> ট্যাগের মাধ্যমে দুটি কন্টেন্টের মধ্যে বিষয়ভিত্তিক বিরতি নির্ধারণ করা হয়।
অর্থাৎ একটি এইচটিএমএল পেজের বিষয়বস্তুকে আলাদা করার জন্য <hr> ট্যাগটি ব্যবহার করা হয়।
নিচের উদাহরণে <hr> ট্যাগের মাধ্যমে দুটি কন্টেন্টের মাঝে বিষয়ভিত্তিক বিরতি নির্ধারণ করা হলোঃ
উদাহরণ
<!DOCTYPE html>
<html>
<body>
<h1>চাঁদপুর</h1>
<p>চাঁদপুর হলো ইলিশের শহর।</p>
<hr>
<h1>রক্তধারা</h1>
<p>রক্তধারা চাঁদপুরের একটি অনন্য ভাস্কর্য।</p>
</body>
</html>
ফলাফল
এট্রিবিউট
নিচের টেবিলে <hr> ট্যাগের এট্রিবিউট, এট্রিবিউটের ভ্যালু এবং তাদের ব্যবহার তুলে ধরা হলোঃ
| এট্রিবিউট | ভ্যালু | বর্ণনা |
|---|---|---|
| align | left center right |
এইচটিএমএল(৫)-এ সাপোর্ট করে না।<hr> এলিমেন্টের align নির্ধারণ করে। |
| noshade | noshade | এইচটিএমএল(৫)-এ সাপোর্ট করে না।<hr> এলিমেন্টের জন্য শ্যাডো কালারের পরিবর্তে সলিড কালার নির্ধারণ করে। |
| size | pixels | এইচটিএমএল(৫)-এ সাপোর্ট করে না।<hr> এলিমেন্টের উচ্চতা নির্ধারণ করে। |
| width | pixels % |
এইচটিএমএল(৫)-এ সাপোর্ট করে না।<hr> এলিমেন্টের প্রস্থ নির্ধারণ করে। |
<hr> ট্যাগে গ্লোবাল এবং ইভেন্ট এট্রিবিউট সাপোর্ট করে কিনা?
| গ্লোবাল এট্রিবিউট | ইভেন্ট এট্রিবিউট |
|---|---|
| সাপোর্ট করে | সাপোর্ট করে |
<hr> ট্যাগের ডিফল্ট স্টাইল
অধিকাংশ ব্রাউজারেই <hr> এলিমেন্ট নিম্নলিখিত স্টাইল ভ্যালুগুলো সহকারে প্রদর্শিত হয়ঃ
hr {
display: block;
margin-top: 0.5em;
margin-bottom: 0.5em;
margin-left: auto;
margin-right: auto;
border-style: inset;
border-width: 1px;
}