به وب سایت حباب ها خوشامدید

تگ هایی که برای تایپ متن ها در HTML باید یاد داشته باشیم

  /  Frontend   /  HTML   /  تگ های مخصوص تایپ و متن ها در HTML
آموزش تگ های HTML | آموزش HTML | آموزش کامل HTML | تگ html

تگ های مخصوص تایپ و متن ها در HTML


به کامل ترین آموزش کار با تگ های تایپ در HTML خوشامدید!!

دسترسی سریع:

قطعاً تا حالا با word کار کردید و ابزار هایی که برای تایپ کردن در اختیار شما میزاره رو ازشون استفاده کردید.

مثلاً شما در Word برای راست چین ، چپ چین و وسط چین کردن متن از ابزار های موجود استفاده میکنید که کار رو برای شما خیلی راحت و روان کرده.

یا هر چیز دیگه که داخل Word وجود داره و شما تا حالا با اون کار کردید.

دقیقاً برای صفحات وب هم همین ابزار ها موجود هست البته در قالب یک تگ یا کد ! که باید کار با اون رو بلد باشید.

خب دیگه زیاد توضیح نمیدم که خسته نشید ، یک راست بریم سراغ مثال و آموزش 😃

تیتر ها و عناوین در HTML:

مطالبی که شما داخل سایت خودتون قرار میدید دارای یکسری تیتر ها و عناوین هستش که برای ایجاد این ها باید از تگ h1 تا h6 استفاده کنید.

توجه توجه: تگ h1 رو فقط باید یکبار در صفحه استفاده کنید ، در غیر این صورت سئوی سایت شما نابود می شود!

هیچ چیز مثل یک مثال ساده نمیتونه مطلب رو بهتر بیان کنه ، پس به مثال زیر خوب دقت کنید:

<h1>عنوان 1</h1>
<h2>عنوان 2</h2>
<h3>عنوان 3</h3>
<h4>عنوان 4</h4>
<h5>عنوان 5</h5>

کد های بالا رو کپی کنید و برید صفحه تست آنلاین کد حباب ها و تگ ها رو تست کنید و خروجی رو مشاهده کنید…

پاراگراف در HTML:

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

شما باید متن خود را بین تگ <p> قرار دهید.

<p>متن مورد نظر شما در تگ پاراگراف</p>

نکته: برای اینکه جمله های ما باهم قاطی نشه و با هم تداخل ایجاد نکنه شما باید هر جمله رو داخل تگ <p> قرار بدید ، در غیر این صورت متن ها و مطالب شما در یک خط صاف و ابدی قرار خواهند گرفت!

کار کردن با این تگ اینقدر راحت و آسون هست که نیازی به مثال نیست ، خودتون تستش کنید 😉

ایجاد حروف درشت:

تا حالا براتون پیش اومده که یک متنی یا کلمه ای خیلی مهم و با اهمیت هست که شما اون رو داخل Word درشت یا همان پررنگ کرده باشیدش ؟

برای اینکه یک کلمه رو درشت و پررنگ بکنیم از تگ <b></b> یا <strong></strong> استفاده میکنیم.

<b> کلمه یا متن شما </b>
<strong> کلمه یا متن شما </strong>

فقط کافیه متن مورد نظر خودتون رو بین تگ قرار بدید تا درشت بشه ، همین !

ایجاد حروف شیب دار:

برای ایجاد حروفی که اینطوری شیب دارن می تونید از تگ های زیر استفاده کنید:

<!-- این تگ معمولاً بیشتر برای مشخص کردن یک آدرس به کار می رود. -->
<address>کلمه یا متن شیب دار شما</address>

<i>کلمه یا متن شیب دار شما</i>

<em>کلمه یا متن شیب دار شما</em>

اصلاً چیزه عجیب و پیچیده ای نبود دیدین ؟!! حتماً این کد هارو یک بار تست کنید.

گذاشتن متن کوچک بالا و پایین اعداد و حروف:

یک نگاه به متن  زیر بندازید:

E=MC2

فکر کنم که متوجه شدید قراره چی میخوام بگم ، بله ، اگه بخواین یک عدد یا حروف خاصی رو بالای یک کلمه یا حرف یا عدد قرار بدید باید از تگ <sup></sup> استفاده کنید ، کد خروجی بالا این هست:

E=MC<sup>2</sup>

حالا اگه همینو بخواین پایین قرار بدید باید از تگ <sub></sub> استفاده کنید:

خروجی:

CO2

کد:

CO<sub>2</sub>

آموزش کشیدن خط در HTML:

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

سلام حباب ها

<hr />

سلام حباب ها

این تگ یک خط صاف بین ( سلام حباب ها ) برای ما ایجاد میکنه.

کشیدن خط روی متن و زیر متن در HTML:

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

<del> متنی که روی آن خط کشیده می شود </del>

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

<ins> متنی که زیر آن خط کشیده می شود </ins>

در این آموزش به تگ های تایپ در HTML اشاره شد ، اگر کم و کسری در این آموزش احساس کردید حتماً کامنت بزارید تا برطرف کنیم.


مدیر حباب ها

متین برونسی مدیر و مؤسس حباب ها می باشد ، او علاقه مند به دنیای کامپیوتر و زبان های برنامه نویسی است... از تخصص های او می توان به برنامه نویسی frontend و backend اشاره کرد (full stack developer)... او تجربیات زیادی در زبان های برنامه نویسی مختلف دارد... ، او گاهاً تجربیات خود را در قالب آموزش در وب سایت حباب ها منتشر می کند...

دیدگاه
ارسال یک نظر