Loading...
سر تیترها در HTML
منظور تعریف سر تیترها در HTML یا همان عناوین از تگ های
تا استفاده می کنیم. مهمترین عنوان و کم اهمیت ترین عنوان را مشخص می کند.
1 2 3 4 5 6 | <h1>Heading 1</h1> <h2>Heading 2</h2> <h3>Heading 3</h3> <h4>Heading 4</h4> <h5>Heading 5</h5> <h6>Heading 6</h6> |
نکته: مرورگر ها به صورت خودکار به قبل و بعد از هر عنوان مقداری فضای خالی اضافه می کنند.
سر تیترها مهم هستند
موتور های جستجو برای ایندکس کردن محتوا و ساختار صفحات وب از عنوان ها یا سر تیترها استفاده می کنند. کاربران، صفحات وب را با توجه به عنوان های آن ها می خوانند. و مهم است که از عنوان ها به منظور نمایش ساختار سند استفاده شود.
اهمیت عنوان ها یا سر تیترها
در HTML باید از
برای نمایش عنوان های اصلی و مهم استفاده شود و با افزایش این عدد از 1 تا 6 از میزان اهمیت عنوان ها کاسته می شود.نکته: هرگز نباید از عنوان ها برای نمایش متون بزرگ (BIG) و یا ضخیم (BOLD) استفاده کرد.
عنوان های بزرگتر
نکته: هرگز نباید از عنوان ها برای نمایش متون بزرگ (BIG) و یا ضخیم (BOLD) استفاده کرد.
هر یک از عنوان ها در HTML دارای انداز پیشفرض می باشند. اما با اسفتاده صفت font-size در CSS می توانید اندازه دلخواه را بر روی آن ها اعمال کنید.
1 | <h1 style="font-size:60px;">Heading 1</h1> |
خطوط افقی
در اسناد HTML به منظور ایجاد یک خط افقی و یا جدا کردن محتوای سند از یک دیگر از تگ
استفاده می شود.
1 2 3 4 5 6 | <h1>This is heading 1</h1> <p>This is some text.</p> <hr> <h2>This is heading 2</h2> <p>This is some other text.</p> <hr> |
عنصر
عنصر هیچ ارتباطی با عنوان های سند ندارد بلکه اطلاعات متای مربوط به سند HTML را در خود نگه می دارد. اطلاعات متا به کاربران نمایش داده نمی شود. تگ باید بین دو تگ و تگ تعریف شود.
1 2 3 4 5 6 7 8 9 10 11 12 | <!DOCTYPE html> <html> <head> <title>My First HTML</title> <meta charset="UTF-8"> </head> <body> . . . |
نکته: معمولا از اطلاعات متا برای تعیین عنوان سند، مجموعه کاراکتر ها، استایل ها، لینک ها، اسکریپت ها و غیره استفاده می شود.
چگونه کدهای منبع یک سند را مشاهده کنیم؟
حتما تا به حال یک صفحه وب را دیده و از خود پرسیده اید که “چگونه آن را ساخته اند؟”.
نحوه مشاهده کدهای منبع
برای اینکار، بر روی صفحه مورد نظر کلیک راست کنید، سپس از منوی باز شده گزینه “View Page Source” را انتخاب کنید. پنجره ایی باز خواهد شد که شامل کد های منبع آن صفحه می باشد. البته با استفاده از این روش فقط می توان کد های HTML، کدهای CSS و جاوا اسکریپت مشاهده کرد.
بازبینی یک عنصر
برای بررسی و بازبینی یک عنصر، ابتدا بر روی آن یا بخش خالی صفحه کلیک راست کنید، سپس از منوی باز شده گزینه “Inspect” و یا “Inspect Element” را انتخاب کنید تا چگونگی ساخته شدن عناصر آن صفحه را مشاهده کنید (در پنجره باز شده کد های HTML و سی اس اس را مشاهده خواهید کرد). البته شما علاوه بر مشاهده کد ها می توانید آن ها را ویرایش کنید.
هیچ نظری ثبت نشده است