سرصفحه

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

عنصر <head> در HTML، یک ظرف برای همه عناصر سرصفحه (به انگلیسی: head) است: <title> ,<style> ,<meta> ,<link> ,<script> و <base>.

عنصر <head> در HTML

عنصر <head> یک ظرف (به انگلیسی: Container) برای فراداده است (داده‌هایی در مورد داده‌ها) و بین تگ <html> و تگ <body> قرار دارد.[۱]

فراداده HTML در مورد سند HTML است. فراداده نمایش داده نمی‌شود.

فراداده معمولاً عنوان سند، مجموعه کاراکتر، استایل‌ها، اسکریپت‌ها و سایر فرا اطلاعات را مشخص می‌کند.

عنصر <title> در HTML

عنصر <title> عنوان سند را مشخص می‌کند و در همهٔ سندهای HTML لازم است.

عنصر <title>:

  • عنوان را در تب مرورگر تعریف می‌کند
  • وقتی که صفحه به موردعلاقه‌ها اضافه شود، یک عنوان برای صفحه فراهم می‌کند
  • در موتورهای جستجو برای صفحه یک عنوان نمایش می‌دهد

یک سند ساده HTML:

مثال

 1 <!DOCTYPE html>
 2 <html>
 3 
 4 <head>
 5   <title>Page Title</title>
 6 </head>
 7 
 8 <body>
 9 The content of the document......
10 </body>
11 
12 </html>


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


عنصر <style> در HTML

عنصر <style> برای تعریف اطلاعات استایل برای یک صفحه HTML به کار می‌رود:

مثال

1 <style>
2   body {background-color: powderblue;}
3   h1 {color: red;}
4   p {color: blue;}
5 </style>


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


عنصر <link> در HTML

عنصر <link> برای پیوند با برگه‌های استایل خارجی استفاده می‌شود:

مثال

<link rel="stylesheet" href="mystyle.css">


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


نکته: در مورد CSS می‌توانید همه چیز را در آموزش CSS ما بیاموزید.

عنصر <meta> در HTML

عنصر <meta> برای تعیین اینکه کدام مجموعه کاراکتر استفاده شود، توصیف صفحه، کلمات کلیدی، نویسنده و سایر فراداده‌ها استفاده می‌شود.

اکثر فرداده‌ها توسط مرورگرها (نحوه نمایش محتوا)، توسط موتورهای جستجو (کلمات کلیدی)، و سایر سرویس‌های وب استفاده می‌شوند.

مجموعه کاراکتر استفاده شده را مشخص می‌کند:

<meta charset="UTF-8">

صفحه وب شما را توصیف می‌کند:

<meta name="description" content="Free Web tutorials">

کلمات کلیدی برای موتورهای جستجو را تعریف می‌کند:

<meta name="keywords" content="HTML, CSS, XML, JavaScript">

نویسنده یک صفحه را مشخص می‌کند:

<meta name="author" content="John Doe">

سند را هر 30 ثانیه تازه‌سازی (به انگلیسی: Refresh) می‌کند:

<meta http-equiv="refresh" content="30">

مثال از تگ <meta>:

مثال

1 <meta charset="UTF-8">
2 <meta name="description" content="Free Web tutorials">
3 <meta name="keywords" content="HTML,CSS,XML,JavaScript">
4 <meta name="author" content="John Doe">


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


تنظیم Viewport

HTML5 یک متد برای دادن کنترل Viewport به طراحان وب از طریق تگ <meta> معرفی کرده‌است.

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

باید عنصر <meta> برای Viewport را در همهٔ صفحات وب خود اضافه کنید:

<meta name="viewport" content="width=device-width, initial-scale=1.0">

عنصر <meta> در viewport دستوراتی در مورد نحوه کنترل ابعاد صفحه و مقیاس بندی‌ها به مرورگر می‌دهد.

قسمت width=device-width عرض صفحه را به گونه ای تنظیم می‌کند که متناسب با عرض صفحه نمایش دستگاه باشد (که بسته به نوع دستگاه متفاوت خواهد بود).

قسمت (به انگلیسی: initial-scale=1.0) سطح بزرگ‌نمایی اولیه را زمانی که صفحه در ابتدا در مرورگر بارگذاری می‌شود، تنظیم می‌کند.

در اینجا یک مثال از صفحه وب بدون تگ viewport meta، و همان صفحه وب با تگ viewport <meta> وجود دارد:

نکته: اگر این صفحه را با موبایل یا تبلت باز می‌کنید، می‌توانید برروی لینک پایین کلیک کنید تا تفاوت را ببینید.

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


عنصر <script> در HTML

عنصر <script> برای تعریف جاوااسکریپت سمت کاربر استفاده می‌شود.

این جاوا اسکریپت داخل یک عنصر HTML با id="demo" می‌نویسد "Hello JavaScript!":

مثال

1 <script>
2 function myFunction {
3   document.getElementById("demo").innerHTML = "Hello JavaScript!";
4 }
5 </script>


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


نکته: برای یادگیری جاوا اسکریپت از آموزش JavaScript ما بازدید کنید.

عنصر <base> در HTML

عنصر <base> آدرس‌وب پایه و target پایه برای همهٔ URLهای نسبی در این صفحه را مشخص می‌کند:

مثال

<base href="https://www.w3schools.com/images/" target="_blank">


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


عنصرهای head در HTML

تگ تعریف
<head> اطلاعاتی در مورد سند مشخص می‌کند
<title> عنوان سند را مشخص می‌کند
<base> یک آدرس پیش فرض یا یک target پیش فرض برای همهٔ لینک‌های صفحه مشخص می‌کند
<link> رابطهٔ بین یک سند و یک منبع خارجی را مشخص می‌کند
<meta> فرادادهٔ مربوط به یک سند HTML را مشخص می‌کند
<script> یک اسکریپت سمت کاربر تعریف می‌کند
<style> اطلاعات استایل مربوط به یک سند را تعریف می‌کند
برای دستیابی به لینک کامل همهٔ تگ‌های HTML، از مرجع تگ HTML ما بازدید کنید.


منابع آموزشی