جستجو در دورآموز

خانه / وبگاه / فرمت متن در اسناد HTML
176 برگشت

فرمت متن در اسناد HTML

فاطمه خوش‌گفتارماهر
فاطمه خوش‌گفتارماهر

مهندس طراحی سایت - سابقه 10 سال تدریس در جهاددانشگاهی مشهد - مدرس نرم افزارها و برنامه های کامپیوتری - عضو تیم برنامه نویسی جی وب

یکشنبه، 08 تیر 1399 ساعت 02:42:44
فرمت متن در اسناد HTML

Formatting یا فرمت متن در اسناد

 

 

Formatting یا فرمت متن در اسناد HTML

 

Formatting یا فرمت متن در اسناد HTML توسط  ۱۱ تگ انجام می‌شود.

 

 

 

 

قبل از توضیح در مورد این تگها ابتدا باید مطلب زیر را متذکر شوم :

در HTML دو نوع تگ داریم :  Phrase Element ها و  Markup Element ها

Markup Element ها فقط روی نحوه نمایش ظاهری محتوای تگ تاثیر دارند ، اما Phrase Element ها علاوه بر اینکه روی نحوه نمایش ظاهری محتوای تگ تاثیر دارند ، می‌توانند به محتوای تگ معنی بدهندهمچنین نرم‌افزارهای ایندکس و موتورهای جستجو بر اساس همین  Phrase Element هاست که مطالب شما راجداسازی و گروه‌بندی می‌کنند. و این از لحاظ Seo  بسیار مهم استتگهای قالب‌بندی یا فرمت متن در HTML برای نمایش انواع خاصی از متن به صورت زیر استفاده می‌شوند:

۱- تگهای <bold> یا ( <b> ) و <strong> در HTML :

هر دو این تگها از لحاظ ظاهری متن را به شکل bold ( توپر و پررنگ ) نمایش می‌دهند . اما تفاوت این دو تگ در این است که  تگ <bold> یک  Markup Element است و تگ <strong> یک Phrase Element است.

مثال :

 

1

2

3

<b>This text uses the bold property </b>

 

<strong>This text uses the strong property</strong>

 

نتیجه مثال فوق به صورت زیر می‌باشد :

This text uses the bold property

This text uses the strong property

همانطور که در بالا می‌بینید دو تگ از لحاظ ظاهری هیچ فرقی با هم نمی‌کنند.

۲- تگهای <em> و <i> در HTML :

هر دو این تگها از لحاظ ظاهری متن را به شکل مورب ( کج ) نمایش می‌دهند . اما تگ <i> یک  Markup Element است و تگ <em> یک Phrase Element است.

مثال :

 

1

2

3

4

<i>This text uses the i property </i>

 

 

<em>This text uses the em property</em>

نتیجه مثال فوق به صورت زیر می‌باشد :

This text uses the i property

This text uses the em property

همانطور که در بالا می‌بینید دو تگ از لحاظ ظاهری هیچ فرقی با هم نمی‌کنند.

۳- تگ <small> در HTML :

این تگ متن داخلش را نسبت به بقیه متون اطرافش با سایزی کوچکتر نمایش می‌دهد.این تگ معمولا داخل یکی از تگهای درج متن مثل تگ <p> استفاده می‌شود.

مثال :

 

1

<p>This text uses the <small>small</small> property</p>

نتیجه مثال فوق به صورت زیر می‌باشد :

This text uses the small property

۴- تگ <big> در HTML :

این تگ متن داخلش را نسبت به بقیه متون اطرافش با سایزی بزرگتر نمایش می‌دهد.این تگ معمولا داخل یکی از تگهای درج متن مثل تگ <p> استفاده می‌شود.

مثال :

 

1

<p>This text uses the <big>big</big> property</p>

نتیجه مثال فوق به صورت زیر می‌باشد :

This text uses the big property

۵- تگ <mark> در HTML :

اگر بخواهید قسمتی از یک متن یا تمام  متن را هایلایت یا با رنگ پشت زمینه مشخص کنید می‌توانید از این تگ استفاده کنید. این تگ  را هم می‌توانید داخل یکی از تگهای درج متن مثل تگ <p> استفاده کنید.

مثال :

 

1

2

3

4

<p>This text uses the<mark> mark </mark> property</p>

 

 

<mark>This text uses the mark property</mark>

نتیجه مثال فوق به صورت زیر می‌باشد :

This text uses the mark property

This text uses the mark property

۶- تگ <del> در HTML :

کشیدن خط برروی یک قسمت از یک متن (پاراگراف) و نمایش حذف ظاهری آن از متن.

مثال

 

1

<p>This text uses the<del> del </del> property</p>

نتیجه مثال فوق به صورت زیر می‌باشد :

This text uses the del property

۷- تگ <ins> در HTML :

درج متن جایگزین به صورت زیر خط دار برای متن حذف شده در متن ( پاراگراف ) توسط تگ <del>.

مثال :

 

1

<p>This text uses the <ins>Ins</ins> Instead <del> del </del> property</p>

نتیجه مثال فوق به صورت زیر می‌باشد :

This text uses the Ins Instead del property

۸- تگ <sub> در HTML :

قراردادن یک متن یا عدد با سایزی کوچکتر نسبت به بقیه متن و پایینتر از سطح متن فعلی ( اندیس پایین).

مثال :

 

1

2

3

4

<p>This text uses the <sub>sub</sub> property</p>

 

 

<p>The number 5<sub>13</sub> represents the lower index of 5</p>

نتیجه مثال فوق به صورت زیر می‌باشد :

This text uses the sub property

The number 513 represents the lower index of 5

۹- تگ <sup> در HTML :

قراردادن یک متن یا عدد با سایزی کوچکتر نسبت به بقیه متن و بالاتر از سطح متن فعلی ( اندیس بالا )

مثال :

 

1

2

3

4

<p>This text uses the <sup>sup</sup> property</p>

 

 

<p>The number 5 is displayed as 16 with power of 5 <sup>16</sup></p>

نتیجه مثال فوق به صورت زیر می‌باشد :

This text uses the sup property

The number 5 is displayed as 16 with power of 5 16

 

جهت برقراری ارتباط با نویسنده پست و یا ارسال نظر اطلاعات زیر را وارد نمایید
تصویر کپچا دورآموز
سوالات متداول دورآموز