آموزش فارسی و کاربردی HTML : آشنایی با HTML (درس اول) - بهینگی

آموزش فارسی و کاربردی HTML : آشنایی با HTML (درس اول)

71
1
اشتراک گذاری :
html,آمووزش_اچ_تی_ام_ال,html_training,introduction_html

در بخش آموزش بهینگی به موضوع طراحی صفحات وب با HTML می پردازیم. این مطلب که دومین مطلب از این سری آموزشی می باشد، به آشنایی با HTML  شامل تعریف، عناصر، تگها و …. می پردازد.

آشنایی با HTML

HTML در واقع استاندارد نشانه گذاری برای ایجاد صفحات وب است.

  • HTML مخفف عبارت Hyper Text Markup Language است.
  • HTML ساختار صفحات وب را با استفاده از نشانه گذاری توصیف می کند.
  • عناصر HTML بلوک های سازنده صفحات HTML هستند.
  • عناصر HTML با تگ نمایش داده می شوند.
  • تگ های HTML بخشهایی از محتوا مانند “عنوان”، “پاراگراف”، “جدول” و غیره را مشخص می کند.
  • مرورگر تگ های HTML را نمایش نمی دهد، بلکه از آنها برای ایجاد محتوای صفحه استفاده می کند.

 

مثال ۱ : یک سند HTML ساده

آموزش فارسی و کاربردی HTML : آشنایی با HTML (درس اول)
<! DOCTYPE html>
<html>
<head>
<title> عنوان صفحه </ title>
</ head>
<body>

<h1> اولین سرفصل </ h1>
<p> اولین پاراگراف </ p>

</ body>
</ html>

تشریح مثال ۱

  • اعلامیه <! DOCTYPE html> این سند را HTML5 تعریف می کند.
  • عنصر <html> عنصر ریشه یک صفحه HTML است.
  • عنصر <head> حاوی اطلاعات متا در مورد سند است.
  • عنصر <title> یک عنوان را برای سند مشخص می کند.
  • عنصر <body> حاوی محتوای صفحه قابل مشاهده است.
  • عنصر <h1> یک عنوان بزرگ را تعریف می کند.
  • عنصر <p> پاراگراف را تعریف می کند.

تگهای HTML

تگ های HTML نام عناصر محصور شده توسط براکت زاویه هستند:

<tagname> … </ tagname>

  • تگ های HTML معمولا به صورت دوتایی مانند <p> و </ p> قرار می گیرند.
  • اولین تگ در یک جفت تگ شروع است، تگ دوم تگ پایان است.
  • تگ پایان مانند تگ شروع می شود، اما قبل از اسم تگ، اسلش قبل از آن وارد شده است.
  • تگ شروع نیز تگ باز نامیده می شود، و تگ پایانی، تگ بسته.

مرورگرهای وب

هدف مرورگر وب (Chrome، IE، Firefox، Safari)، خواندن اسناد HTML و نمایش آنها است.

مرورگر تگ های HTML را نمایش نمی دهد، بلکه از آنها برای تعیین نحوه نمایش سند استفاده می کند:

آموزش فارسی و کاربردی HTML : آشنایی با HTML (درس اول)

ساختار صفحه HTML

در زیر تصویری از ساختار صفحه HTML است:
آموزش فارسی و کاربردی HTML : آشنایی با HTML (درس اول)
<html>
<head>
<title> عنوان صفحه </ title>
</ head>
<body>
<h1> این یک عنوان است </ h1>
<p> این یک پاراگراف است. </ p>
<p> این پاراگراف دیگری است. </ p>
</ body>
</ html>

🛑توجه: فقط محتوا در قسمت <body> (قسمت سفید در بالا) در مرورگر نمایش داده می شود.

اعلامیه <DOCTYPE!>

اعلامیه <! DOCTYPE>، نشان دهنده نوع سند است و به مرورگر کمک می کند تا صفحات وب به درستی نمایش داده شوند.

این تگ باید فقط یک بار در بالای صفحه ظاهر شود (قبل از تگ های HTML).

اعلام <! DOCTYPE> به بزرگی و کوچکی حروف حساس نیست.

  • اعلامیه <! DOCTYPE> برای HTML5:
    آموزش فارسی و کاربردی HTML : آشنایی با HTML (درس اول)
با گوشی اسکن کنید
"یک ستاره""دو ستاره""سه ستاره""چهار ستاره""پنج ستاره!"

اولین امتیاز را شما بدهید
Loading...

نویسندگان:
ترتیب پیشنهادی بهینگی برای آموزش فارسی و کاربردی HTML:
  • HTML چیست؟ معرفی اجمالی HTML

دیدگاه بگذارید

1 دیدگاه برای "آموزش فارسی و کاربردی HTML : آشنایی با HTML (درس اول)"

به من اطلاع بده
avatar
نمایش بر اساس:   جدیدترین ها | قدیمی ترین ها | محبوب ترین ها
طاها ازغدي
مهمان

بسیار کاربردی بود،👌🏻

wpDiscuz