عنوان‌ها

از ویکی‌کد، دانشنامهٔ برنامه‌نویسی
(تغییرمسیر از عنوان اِچ تی اِم اِل)
پرش به ناوبری پرش به جستجو
Main Page Tutorial
Html-menu.png
موارد آموزشی
۱خانه
۲مقدمه
۳ویرایشگرها
۴پایه
۵عنصرها
۶ویژگی‌ها
۷عنوان‌ها
۸پاراگراف‌ها
۹استایل‌ها
۱۰قالب‌بندی
۱۱نقل‌قول‌ها
۱۲توضیحات
۱۳رنگ‌ها
۱۴CSS
۱۵لینک‌ها
۱۶تصاویر
۱۷جداول
۱۸لیست‌ها
۱۹بلوک‌ها
۲۰کلاس‌ها
۲۱شناسه
۲۲Iframeها
۲۳جاوا اسکریپت
۲۴مسیرهای فایل
۲۵سرصفحه
۲۶چیدمان‌ها
۲۷واکنش‌گرا
۲۸کد کامپیوتری
۲۹معنایی‌ها
۳۰راهنمای استایل
۳۱موجودیت‌ها
۳۲نماد‌ها
۳۳ایموجی‌ها
۳۴مجموعه کاراکترها
۳۵رمزگذاری URL
۳۶HTML و XHTML
فرم‌های HTML
گرافیک در HTML
رسانه در HTML
APIها در HTML
مثال‌ها
مرجع HTML


Time2wait.svg ساخت نمونه مثال این بخش در دست اقدام است.



مشاهدهٔ نتیجه

عنوان های HTML

عنوان‌ها توسط تگ‌های <h1> تا <h6> تعریف می‌شوند.[۱]

<h1> بعنوان مهمترین عنوان و <h6> بعنوان کم‌اهمیت‌ترین عنوان تعریف می‌شود.

مثال

1 <h1>Heading 1</h1>
2 <h2>Heading 2</h2>
3 <h3>Heading 3</h3>
4 <h4>Heading 4</h4>
5 <h5>Heading 5</h5>
6 <h6>Heading 6</h6>


مشاهدهٔ نتیجه


توجه: مرورگرها بطور خودکار قبل و بعد از یک عنوان فاصله سفید (حاشیه) اضافه می‌کنند.

عنوان‌ها مهم هستند

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

کاربران اغلب عنوان‌های یک صفحه را بطور سطحی می‌خوانند (به انگلیسی: skim). استفاده از عنوان برای نشان دادن ساختار سند مهم است.

عنوان‌های <h1> را باید برای عنوان‌های اصلی استفاده کرد به همراه عنوان‌های <h2> سپس عنوان کم‌اهمیت‌تر <h3> و به همین ترتیب.

نکته: از عنوان‌های HTML فقط برای عنوان استفاده کنید. از عنوان‌ها برای درشت یا برجسته کردن متن استفاده نکنید.

عنوان های بزرگتر

هر عنصر HTML یک اندازه پیش فرض دارد. با این حال می‌توانید اندازه هر عنوان را با ویژگی style، با استفاده از خصوصیت font-size تعیین کنید:

مثال

<h1 style="font-size:60px;">Heading 1</h1>


مشاهدهٔ نتیجه


خطوط افقی HTML

تگ <hr> یک فاصلهٔ موضوعی را در صفحه HTML نشان می‌دهد، و اغلب اوقات بصورت یک خط افقی نمایش داده می‌شود.

عنصر <hr> برای جدا کردن محتوا (یا مثلاً یک تغییر) در صفحه HTML استفاده می‌شود:

مثال

1 <h1>This is heading 1</h1>
2 <p>This is some text.</p>
3 <hr>
4 <h2>This is heading 2</h2>
5 <p>This is some other text.</p>
6 <hr>


مشاهدهٔ نتیجه


عنصر HTML <head>

عنصر <head> یک ظرف (به انگلیسی: Container) برای فراداده (به انگلیسی: Meta Data) است. فرادادهٔ HTML داده‌ای در مورد سند HTML است. فراداده نمایش داده نمی‌شود.

عنصر <head> بین تگ <html> و تگ <body> قرار می گیرد:

مثال

 1 <!DOCTYPE html>
 2 <html>
 3 
 4 <head>
 5   <title>My First HTML</title>
 6   <meta charset="UTF-8">
 7 </head>
 8 
 9 <body>
10 .
11 .
12 .


مشاهدهٔ نتیجه


نکته: به طور معمول فراداده عنوان سند، مجموعه کاراکتر، استایل‌ها، اسکریپت‌ها و سایر فرادادهٔ دیگر تعریف می‌شوند.

چگونه منبع HTML را ببینیم؟

آیا تا بحال هنگام مشاهدهٔ یک صفحه وب با خود فکر کرده‌اید

اوه! چطور این‌کار را انجام داده‌اند؟

‎‎‎دیدن کد منبع HTML

روی یک صفحه HTML کلیک راست کرده و “View Page Source” (در Chrome) یا “View Source” را (در Edge) یا مشابه آن را در مرورگرهای دیگر انتخاب کنید. این کار پنجره‌ای شامل کد منبع HTML صفحه را باز می‌کند.

بررسی یک عنصر HTML

روی یک عنصر (یا ناحیه خالی) کلیک راست کرده و “Inspect” یا “Inspect Element” را انتخاب کنید تا مشاهده کنید عنصر از چه چیزی تشکیل شده (هم HTML و هم CSS را خواهید دید). همچنین می‌توانید HTML یا CSS را همزمان در عنصر یا پنل استایلی که باز می‌شود ویرایش کنید.

تمرین های HTML

Time2wait.svg ساخت نمونه مثال این بخش در دست اقدام است.


مرجع تگ HTML

مرجع تگ WikiCod شامل اطلاعات اضافی در مورد این تگ‌ها و ویژگی‌هایشان است.

در مورد تگ‌های HTML و ویژگی‌ها در بخش‌های بعدی این آموزش خواهید آموخت.

تگ تعریف
<html> ریشه یک سند HTML را تعریف می‌کند
<body> بدنه سند را تعریف می‌کند
<head> ظرفی برای همهٔ عناصر head (عنوان، اسکریپت‌ها، استایل‌ها، فراداده، و …)
<h1> to <h6> عنوان‌های HTML را تعریف می‌کند
<hr> تغییر موضوعی در محتوا را تعریف می‌کند
برای یافتن لیست کامل همهٔ تگ‌های HTML موجود، مرجع تگ HTML ما را مشاهده کنید.


منابع آموزشی