اضافه کردن خطوط افقی برای شکستن محتوا در صفحه

نحوه استفاده از برچسب HR برای سند وب

برچسب HR به طور سنتی برای اضافه کردن یک خط افقی (گاهی اوقات به نام قانون افقی) به یک سند وب مورد استفاده قرار می گیرد. برای اضافه کردن یک خط، شما تایپ می کنید:


برای دستور دادن به مرورگر برای رسم خط در عرض عرض صفحه یا عنصر پدر و مادر با استفاده از تنظیمات پیش فرض. این خط پیش فرض ساده است و اغلب به هدفش عمل می کند، اما ویژگی ها را می توان برای تغییر اندازه خط، رنگ و موقعیت در میان ویژگی های دیگر تعیین کرد. روش برای اصلاح ظاهر خط افقی بین HTML4 و HTML5 تغییر کرد .

آیا معنای کلمه HR چیست؟

در HTML4، برچسب HR به معنای معنایی نبود. عناصر معنایی معنی خود را از نظر مرورگر توضیح می دهند و توسعه دهنده به راحتی می تواند درک کند. برچسب HR تنها راه اضافه کردن یک خط ساده به یک سند در هر کجا که شما آن را می خواستید. یک ظاهر طراحی شده تنها مرز بالا یا پایین از عنصر که در آن شما می خواستید خط به نظر می رسد خط افقی را در بالا یا پایین عنصر قرار داده است، اما به طور کلی، برچسب HR برای استفاده آسان تر از این بود.

شروع با HTML5، تگ HR تبدیل به معنایی شد، و در حال حاضر یک پارامتر تضاد موضوعی را تعریف می کند که یک شکست در جریان محتوا است که یک صفحه جدید و یا دیگر معیار قوی را تأیید نمی کند - این تغییرات موضوع است . به عنوان مثال، ممکن است پس از تغییر یک صحنه در یک داستان، یک برچسب HR پیدا کنید یا آن را تغییر دهید. موضوع را در یک سند مرجع نشان می دهد.

ویژگی های HR در HTML4 و HTML5

در HTML4، تگ HR می تواند ویژگی های ساده ای از جمله "align،" "width" و "noshade" را اعطا کند. تنظیم می تواند به چپ، مرکز، راست یا توجیه شود. عرض پهنای خط افقی را از 100 درصد پیش فرض تنظیم کرد که خط را در سراسر صفحه گسترش داد. ویژگی اسفاده شده به جای رنگ سایه ای یک خط رنگ جامد را ارائه می دهد. این ویژگی ها در HTML5 منسوخ شده است و شما باید از CSS برای تگ های HR خود در HTML5 استفاده کنید. به عنوان مثال، در HTML 4:


یک خط افقی با ارتفاع 10 پیکسل تولید می کند.

با استفاده از CSS با HTML5، یک خط افقی است که 10 پیکسل بالا طراحی شده است:


با استفاده از CSS به سبک خط افقی خود را به شما اجازه می دهد بسیاری از آزادی در طراحی صفحه وب خود را. شما می توانید نمونه های بسیاری از سبک ها را برای برچسب های HR در این Style Style HR Tag ببینید. فقط سبک های عرض و ارتفاع در تمام مرورگرها سازگار هستند، بنابراین در هنگام استفاده از سایز های دیگر، ممکن است مورد آزمایش و خطا باشد. عرض پیش فرض همیشه 100 درصد عرض صفحه وب یا عنصر والدین است. ارتفاع پیش فرض این قانون دو پیکسل است.