همه چیز درباره عناصر در HTML

html elements tutorial
20 آبان 1403

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

هر عنصر در HTML از دو بخش تشکیل شده است: یک تگ باز و یک تگ بسته. عناصر می‌توانند انواع مختلفی داشته باشند، از جمله تگ‌های متنی مانند <p>، تگ‌های عناوین مانند <h1> تا <h6>، و یا تگ‌های تصویری مانند <img> که برای نمایش تصاویر استفاده می‌شود.

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

تگ‌های HTML می‌توانند شامل صفاتی (Attributes) باشند که عملکرد یا نمایش آنها را تغییر می‌دهند. برای مثال، برای تگ <a> که برای لینک‌ها استفاده می‌شود، صفت href مشخص می‌کند به کجا منتقل خواهید شد.

به صورت کلی، آشنایی با عناصر HTML و کاربردهای آن‌ها به شما کمک می‌کند که سایت‌های پویا و کاربرپسند بسازید که تجربه کاربری خوبی را به بازدیدکنندگان ارائه دهد.

<!DOCTYPE html>
<html lang="fa">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>مثال از عناصر HTML</title>
</head>
<body>
  <h1>این یک عنوان است</h1>
  <p>این یک پاراگراف متن نمونه است.</p>
  <img src="image.jpg" alt="نمونه تصویر">
  <a href="https://example.com">این یک لینک است</a>
</body>
</html>

توضیح کد:


<!DOCTYPE html>
این خط تعیین می‌کند که سند از نوع HTML است.
<html lang="fa">
شروع سند HTML با زبان فا (فارسی).
<head>
بخشی که شامل اطلاعات متا و عنوان سایت می‌شود.
<meta charset="UTF-8">
مجموعه کارکترها را به UTF-8 تنظیم می‌کند که از اکثر کارکترهای جهانی پشتیبانی می‌کند.
<title>مثال از عناصر HTML</title>
عنوانی که در نوار بالای مرورگر نمایش داده می‌شود.
<body>
بخش اصلی محتوا که نمایش داده می‌شود.
<h1>این یک عنوان است</h1>
یک عنوان اصلی بزرگ در صفحه نمایش داده می‌شود.
<p>این یک پاراگراف متن نمونه است.</p>
یک پاراگراف از متن نمونه نمایش داده می‌شود.
<img src="image.jpg" alt="نمونه تصویر">
یک تصویر با آدرس image.jpg و توضیحات جایگزین «نمونه تصویر» نمایش داده می‌شود.
<a href="https://example.com">این یک لینک است</a>
یک لینک که به آدرس example.com هدایت می‌کند.

سوالات متداول

؟

چگونه یک تگ HTML را ببندم؟

؟

چه تفاوتی بین تگ‌های <div> و <span> وجود دارد؟

؟

چگونه یک تصویر در HTML درج کنم؟