دات نت نیوک
قالب بندی متن در HTML

ظاهر و قالب بندی مطالب

این یک متن برجسته شده است

ای یک متن خوابانده شده است

این یک متن بالا نوشته شده است

تگ های قالب بندی در HTML

در فصل قبل درباره تغییر خصوصیات ظاهری محتوای داخل تگ های HTML با استفاده از خصوصیات مربوط به ویژگی style مطالبی را آموختید.

در اسناد HTML المان هایی هستند که به صورت مستقل خصوصیت ظاهری متن ها را به صورت مستقل تعریف می کنند.

برای مثال در HTML با استفاده از تگ های <b> و <i> می توانید خصوصیات متن را از حالبت پیش فرض به ترتیب به حالت های برجسته (Bold) و خوابیده (Italic) تغییر ظاهر دهید.

المان های تغییر دهنده قالب بندی متن ها برای حالت های مختلفی از ظاهر متن طراحی شده اند که در زیر فهرست شده است:

  • متن های برجسته (Bold)
  • متن های با اهمیت (Important)
  • متن های خوابیده (Italic)
  • متن های تاکید شده که مشابه (Emphasized)
  • متن های مشخص شده با رنگ پس زمینه (Marked)
  • متن های کوچک (Small)
  • متن های خط خورده (Deleted)
  • متن های تاکید شده با زیر خط دار شدن (Inserted)
  • متن های پایین نوشته شده (Subscripts)
  • متن های بالا نوشته شده (Superscripts)

تگ های قالب بندی Bold و Strong در HTML

برای برجسته کردن حروف متن از تگ <b> استفاده می شود. این تگ خصوصیت برجسته شدن (Bold) شدن را تعریف می کند بدون آن که اهمیت مضاعفی از لحاظ رتبه بندی در متن به آن بدهد. منظور از رتبه بندی یا درجه اهمیت و قدرت، مورد تاکید قرار گرفتن برای موتورهای جستجو است.

مثال

<p>این یک پاراگراف با متن معمولی است.</p>

<p><b>این یک پاراگراف با متن برجسته است</b>.</p>

خودتان آزمایش کنید »

تگ <strong> علاوه بر برجسته (Bold) کردن حروف متن مثل تگ <b>، معنای قوی تر و با اهمیت تر بودن نسبت به سایر قسمت های متن را برای موتورهای جستجو دارد.

مثال

<p>این یک پاراگراف با متن معمولی است.</p>

<p><strong>این یک پاراگراف با متن برجسته قدرتمندتر است</strong>.</p>

خودتان آزمایش کنید »

تگ های قالب بندی خوابیده و تاکید شده در HTML

برای خواباندن حروف متن از تگ <i> استفاده می شود. این تگ خصوصیت خوابانده کردن (Italic) را تعریف می کند بدون آن که اهمیت مضاعفی از لحاظ رتبه بندی در متن به آن بدهد.

مثال

<p>این یک پاراگراف با متن معمولی است.</p>

<p><i>این یک پاراگراف با متن خوابیده است</i>.</p>

خودتان آزمایش کنید »

تگ <em> علاوه بر خواباندن (Italic) کردن حروف متن مثل تگ <i>، روی آن متن تاکید می کند و برای موتورهای جستجو مهمتر از سایر قسمت های متن تشخیص داده می شود.

مثال

<p>این یک پاراگراف متن معمولی است.</p>

<p><em>این یک پاراگراف متن خوابیده و تاکید شده است.</em>.</p>

خودتان آزمایش کنید »
Note تگ های <b> و <strong> از لحاظ ظاهری در مرورگر شبیه به هم نمایش داده می شوند. این حالت برای تگ های <i> و <em> نیز همین طور است.
با این حال، تگ های <b> و <i> عملیات برجسته کردن و خواباندن حروف را انجام می دهند و این در حالی است که تگ های <strong> و <em> معنی پر اهمیت و تاکید بر متن را علاوه بر تغییر ظاهری به موتورهای جستجو نیز نشان می دهند.

تگ قالب بندی کوچک کننده در HTML

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

مثال

<h2>این المان باعث <small>کوچک شدن< /small> متن در صفحات وب می شود</h2>

خودتان آزمایش کنید »

تگ قالب بندی مشخص کننده در HTML

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

مثال

<h2>این المان باعث <mark>مشخص کردن و به چشم آمدن</mark> متن در صفحات وب می شود</h2>

خودتان آزمایش کنید »

تگ قالب بندی خط زننده متن در HTML

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

مثال

<h2>این المان باعث <del>خط خوردن</del> متن در صفحات وب می شود</h2>

خودتان آزمایش کنید »

تگ قالب بندی زیرخط دار کننده متن در HTML

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

مثال

<h2>این المان باعث <ins>زیر خط دار شدن</ins> متن در صفحات وب می شود</h2>

خودتان آزمایش کنید »

تگ قالب بندی بالانویس کننده متن در HTML

برای بالاتر بردن متن از خط کرسی یا بالانویس کردن یک متن از تگ <sup> استفاده می شود.

مثال

<h2>این المان باعث <sup>رونویس شدن با اندازه کوچک تر</sup> متن در صفحات وب می شود</h2>

خودتان آزمایش کنید »

تگ قالب بندی زیرنویس کننده متن در HTML

برای پایین آوردن متن از خط کرسی یا زیرنویس کردن یک متن از تگ <sub> استفاده می شود.

مثال

<h2>این المان باعث <sub>زیرنویس شدن با اندازه کوچک تر</sub> متن در صفحات وب می شود</h2>

خودتان آزمایش کنید »

مرجع تگ ها و المان های HTML

در زیر جدولی از عناصر، المان ها یا همان تگ های HTML را ملاحظه می فرمایید که به دسته بندی قالب بندی متن در HTML مربوط است.

نام تگ HTML توضیح درباره تگ HTML
<b> متن داخل خود را به صورت برجسته (Bold) نمایش می دهد
<em> متن داخل خود را به صورت خوابیده و با درجه تاکید برای موتورهای جستجو (Emphasized) نمایش می دهد
<i> متن داخل خود را به صورت خوابیده (Italic) نمایش می دهد
<small> متن داخل خود را به صورت کوچک تر (Small) نمایش می دهد
<strong> متن داخل خود را به صورت برجسته و با درجه اهمیت بیشتر برای موتورهای جستجو (Strong/Important) نمایش می دهد
<sub> متن داخل خود را به صورت زیرنویس و کوچک تر (Sub scripted) نمایش می دهد
<sup> متن داخل خود را به صورت بالانویس و کوچک تر (Super scripted) نمایش می دهد
<ins> متن داخل خود را به صورت زیرخط دار و تاکید شده (Inserted) نمایش می دهد
<del> متن داخل خود را به صورت خط خورده یا حذف شده (Deleted) نمایش می دهد
<mark> متن داخل خود را به صورت مشخص شده و علامت خورده (Marked/Highlighted) نمایش می دهد
نظر و پرسش و پاسخ کاربران
  نخستین نفری باشید که می پسندید.
نمایش 0 نظر ترتیب نمایش

در صفحه "آشنایی با المان (تگ)هایی که برای قالب بندی متن در HTML استفاده می شوند.": نخستین نظر دهنده باشید
مشاهده نظرات
نام

نظرات خود را مطرح کنید
*
*
*
*
*
Captcha:
آخرین اخبار و مقالات

آگهی ها
کارگزاران تجارت الکترونیک ایران
گرافیک پوسته وب سایت در کامپیوتر
گرافیک پوسته وب سایت در تبلت
گرافیک پوسته وب سایت در موبایل
طراحی واکنشگرا (Responsive)
پنل مدیریتی پیشرفته و کاربر پسند
قابل توسعه و ارتقاء و 100% داینامیک
امکانات کامل SEO برای موتورهای جستجو