HTML text formatting(فرمت متنهای html)

HTML <b> and <strong> Elements

المنت <b> متن را بولد (چاق ) میکند.یعنی چی ؟ به مثال زیر توجه فرمایید :

<!DOCTYPE html>
<html>
<body>
<p>این متن نرمال است</p>
<p><b>این متن به صورت بولد است</b></p>
</body>
</html>

 اگر کد بالا را در  notepad  بنویسید و آن را توسط مرورگر باز کنید خروجی به صورت زیر خواهد بود :

bold text

 

المنت <strong> متن را به صورت قوی تعریف میکند به مثال زیر توجه فرمایید:

<!DOCTYPE html>
<html>
<body>

<p>این متن نرمال است </p>

<p><strong>این متن  قوی است </strong></p>

</body>
</html>

اگر کد بالا را در  notepad  بنویسید و آن را توسط مرورگر باز کنید خروجی به صورت زیر خواهد بود :

format text


HTML <i> and <em> Elements

المنت <i> متن را به صورت italic تعریف میکند . به مثال زیر توجه کنید برای اینکه تفاوت را مشاهده کنید متن انگلیسی قرار میدهم :

<!DOCTYPE html>
<html>
<body>

<p>This text is normal.</p>

<p><i>This text is italic.</i></p>

</body>
</html>

اگر کد بالا را در  notepad  بنویسید و آن را توسط مرورگر باز کنید خروجی به صورت زیر خواهد بود :

italic text

المنت <em> متن های emphasized (تاکید شده) را ایجاد میکنند. به مثال زیر توجه فرمایید :

<!DOCTYPE html>
<html>
<body>

<p>This text is normal.</p>

<p><em>This text is emphasized.</em></p>

</body>
</html>

 

 

اگر کد بالا را در  notepad  بنویسید و آن را توسط مرورگر باز کنید خروجی به صورت زیر خواهد بود :

emphzsized text

توجه:مرورگر ها متن هایی را که با <strong>ایجاد میشوند را مشابه با متن های که با <b> ایجاد میشوند و همچنین متن های <em> را مشابه با متن های <i> نمایش میدهند.تفاوت تنها در معنی این تگ هاست .

HTML <small> Element

المنت <small> متن ها را به صورت کوچک نمایش میدهد .به مثال زیر توجه فرمایید:

<!DOCTYPE html>
<html>
<body>

<h2>HTML <small>Small</small> Formatting</h2>

</body>
</html>

اگر کد بالا را در  notepad  بنویسید و آن را توسط مرورگر باز کنید خروجی به صورت زیر خواهد بود :

small formatting


HTML <mark> Element

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

<!DOCTYPE html>
<html>
<body>

<h2>HTML <mark>Marked</mark> Formatting</h2>

</body>
</html>

اگر کد بالا را در  notepad  بنویسید و آن را توسط مرورگر باز کنید خروجی به صورت زیر خواهد بود :

marked formatting


HTML <del> Element

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

<!DOCTYPE html>
<html>
<body>


<p>رنگ مورد علاقه من <del>آبی</del> قرمز است.</p>
<p>My favorite color is <del>blue</del> red.</p>

</body>
</html>

اگر کد بالا را در  notepad  بنویسید و آن را توسط مرورگر باز کنید خروجی به صورت زیر خواهد بود :

deleted formatting


HTML <ins> Element

المنت <ins> متن ها رابه صورت زیر نویس(subscripted) تعریف میکند .به مثال زیر توجه فرمایید:

<!DOCTYPE html>
<html>
<body>

<p>این یک متن  <sub>زیرنویس دار</sub> است.</p>
<p>This is <sub>subscripted</sub> text.</p>

</body>
</html>

اگر کد بالا را در  notepad  بنویسید و آن را توسط مرورگر باز کنید خروجی به صورت زیر خواهد بود :subscripte text


HTML <sup> Element

المنت  <sup> متن superscripted  را تعریف می کند.به مثال زیر توجه فرمایید:

<!DOCTYPE html>
<html>
<body>

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

</body>
</html>

اگر کد بالا را در  notepad  بنویسید و آن را توسط مرورگر باز کنید خروجی به صورت زیر خواهد بود :

superscripted text

 

دیدگاهتان را بنویسید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *