قالب بندی متن HTML

فرمت‌بندی متن در HTML

در HTML چندین عنصر وجود دارد که برای تعریف متن‌هایی با معنای خاص طراحی شده‌اند.

مثال (کد):

This text is bold

This text is italic

This is subscript and superscript

 عناصر فرمت‌دهی در HTML

عناصر فرمت‌دهی برای نمایش انواع خاصی از متن طراحی شده‌اند:

 تگ‌های <b> و <strong> در HTML

تگ <b> برای پررنگ کردن متن استفاده می‌شود، اما بدون اینکه معنای خاصی یا تأکیدی داشته باشد.

مثال (کد):

<b>This text is bold</b>

تگ <strong> برای نشان دادن اهمیت متن استفاده می‌شود و معمولاً به‌صورت پررنگ نمایش داده می‌شود.

مثال (کد):

<strong>This text is important!</strong>

🔹 تگ‌های <i> و <em> در HTML

تگ <i> برای نمایش متن به حالت کج (Italic) است، و معمولاً برای نشان دادن اصطلاحات تخصصی، واژه‌های خارجی، افکار، نام کشتی‌ها و... استفاده می‌شود.

مثال (کد):

<i>This text is italic</i>

تگ <em> برای تأکید روی متن به کار می‌رود و معمولاً به‌صورت کج نمایش داده می‌شود.

نکته: صفحه‌خوان‌ها (برای نابینایان) متن داخل <em> را با تأکید تلفظ می‌کنند.

مثال (کد):

<em>This text is emphasized</em>

 تگ <small> در HTML

تگ <small> برای نمایش متنی با اندازه کوچکتر به‌کار می‌رود.

مثال (کد):

<small>This is some smaller text.</small>

 تگ <mark> در HTML

تگ <mark> برای هایلایت کردن متن یا علامت‌گذاری بخش مهمی از آن استفاده می‌شود.

مثال (کد):

<p>Do not forget to buy <mark>milk</mark> today.</p>

تگ <del> در HTML

تگ <del> برای نشان دادن متنی است که از سند حذف شده. مرورگر معمولاً روی چنین متنی خط می‌کشد.

مثال (کد):

<p>My favorite color is <del>blue</del> red.</p>

 تگ <ins> در HTML

تگ <ins> برای نمایش متنی است که به سند اضافه شده. مرورگر معمولاً این متن را زیرخط‌دار نمایش می‌دهد.

🧪 مثال (کد):

<p>My favorite color is <del>blue</del> <ins>red</ins>.</p>

 تگ <sub> در HTML

تگ <sub> متن را به صورت زیرنویس (کمی پایین‌تر از خط معمول) نمایش می‌دهد. اغلب در فرمول‌های شیمیایی مثل H₂O استفاده می‌شود.

مثال (کد):

<p>This is <sub>subscripted</sub> text.</p>

تگ <sup> در HTML

تگ <sup> متن را به صورت بالانویس (کمی بالاتر از خط معمول) نمایش می‌دهد. مثلاً برای شماره پاورقی یا توان ریاضی: x² یا WWW¹.

مثال (کد):

<p>This is <sup>superscripted</sup> text.</p>

 تمرین

 کدام دو تگ زیر متن را به صورت پررنگ (Bold) نمایش می‌دهند؟

 پاسخ درست:

<strong> و <b>

 مرجع تگ‌های فرمت‌بندی متن در HTML