آموزش و يادگيري تگ hr در HTML

در اين بخش از دوره آموزش HTML در آموزش دون ، با تگ <hr> آشنا مي‌شويم. اين تگ براي ايجاد خط افقي جداکننده بين بخش‌ها يا محتواهاي مختلف صفحه وب استفاده مي‌شود.

تگ hr در HTML چيست؟

تگ <hr> يک عنصر خالي (self-closing) است که براي جدا کردن بخش‌هاي محتوا به صورت افقي در صفحه وب کاربرد دارد. اين تگ معمولاً براي جداسازي تيترها، پاراگراف‌ها يا بخش‌هاي معنايي استفاده مي‌شود.

مثال ساده از تگ hr

<h2>بخش اول</h2>
<p>اين يک پاراگراف نمونه است.</p>

<hr>

<h2>بخش دوم</h2>
<p>اين پاراگراف متعلق به بخش دوم است.</p>

در اين مثال، تگ <hr> بين دو بخش محتوا خط افقي ايجاد مي‌کند.

ويژگي‌ها و استايل تگ hr

ويژگي	توضيح
class	اعمال استايل CSS به خط افقي
id	شناسه يکتا براي ارجاع يا استايل‌دهي
style	اعمال استايل مستقيم به خط افقي

مثال با استايل CSS

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

<h2>بخش اول</h2>
<p>اين يک پاراگراف نمونه است.</p>

<hr>

<h2>بخش دوم</h2>
<p>اين پاراگراف متعلق به بخش دوم است.</p>