آموزش کار با عناصر یا Elements در HTML

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

آموزش کار با عناصر یا Elements در HTML

Free-Learn

کار با عناصر یا Elements در HTML

عناصر یا الِمنت ها در HTML از مجموعه ای از تگ ها به وجود می آیند و معمولا هر عنصر دارای یک تگ شروع و یک تگ پایان می باشد، برای مثال لطفا به دستور زیر توجه نمایید :

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

پس بطور کلی میشه گفت دو نوع تگ در HTML داریم :

  • تگ دارای تگ پایان یا همتا
  • تگ تنها یا بدون تگ پایانی

در قسمت های بعدی از آموزش HTML ان شاالله چیزهای بیشتری را یاد خواهید گرفت، یکی از تگ های تنها که میتواند استفاده زیادی داشته باشد، تگ <br> می باشد که برای شکستن خط و رفتن به سطر بعدی از آن استفاده می شود.

Free-Learn

عناصر تودرتو یا Nested Elements در HTML

اگر به یک صفحه ی HTML دقت کنید میبینید که تمامی عناصر در HTML هر کدام فرزند یا پدر عنصر دیگری در همان صفحه است، این عمل رو بهش میگیم Nested Elements که وجود آنها نیز در یک صفحه ی وب ضروری می باشد.

یعنی بطور کلی ما در HTML میتونیم یک عنصر رو درون یک عنصر دیگه قرار بدیم و به همین ترتیب تا غیره. اصلا اگه HTML این قابلیت رو نداشته باشه که هیچ ارزشی نداره و ماهم هیچوقت نمی تونیم یک وبسایت با استفاده از HTML‌ طراحی نماییم.

برای مثال لطفا به دستورات زیر توجه نمایید :

همانطور که مشاهده مینمایید عنصر بدنه یا <body> در داخل عنصر <html> قرار گرفته و همچنین عنصر <h1> در داخل عنصر <body> قرار گرفته است، و همینطور تا غیره.. پس بطور کلی یک صفحه ی HTML از حالت Nested Elements تشکیل شده است.

Free-Learn

تگ پایانی را فراموش نکنید

همونطور که تا به الان مشاهده نمودید ما ۲ نوع تگ داریم، ۱ » تگ دارای تگ پایانی و ۲ » تگ تنها که تگ پایانی ندارد، در HTML‌ نباید فراموش کنید که تگ پایانی یک عنصر را ببندید.

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

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


امتحان کنید

Free-Learn

  • خلاصه ی این بخش
  • بطور کلی ۲ نمونه تگ داریم، ۱: تگی که دارای تگ پایانی می باشد، ۲: تگ تنها که تگ پایانی ندارد.
  • همیشه سعی کنید وقتی یک تگ را باز میکنید بلافاصله اگر تگ پایانی دارد آنرا ببندید.
  • تگ های تنها تگ هایی هستند که فقط تگ شروع دارند و هیچ تگی برای بستن ندارند.
  • دانلود PDF این آموزش
  • برای دانلود فایل PDF این آموزش کلیک نمایید