HTMLالوسم <head>
- تعريفه
- دعم المتصفحات
- خصائصه
- إستخدامه
- تصميمه الإفتراضي
- نصائح و ملاحظات
تعريفه
يعتبر الوسم <head>
من الأقسام الرئيسية في الصفحة لأنه يستخدم لإعلام المتصفح بكيفية عرض محتوى الصفحة بالإضافة إلى إمكانية تضمين ملفات التصميم، سكربتات الصفحة، أيقونة الموقع و غيرها من الأشياء المهمة فيه.
بشكل عام، كل ما يوضع بداخل هذا الوسم الهدف منه ليس أن يظهر بشكل مباشر في الصفحة بل أن يحسّن طريقة ظهور محتوى الصفحة الموضوع في الوسم <body>
.
دعم المتصفحات
Chrome | Edge | Firefox | Opera | Safari | Android Webview |
Chrome for Android |
Firefox for Android |
Opera for Android |
Safari for IOS |
Samsung Internet |
1 | 12 | 1 | مدعوم | مدعوم | مدعوم | مدعوم | 4 | مدعوم | مدعوم | مدعوم |
خصائصه
لا يملك أي خصائص تم إعدادها خصيصاً له.
إستخدامه
في المثال التالي قمنا بإضافة وسم <style>
في الوسم <head>
و بداخله قمنا بوضع كود CSS بهدف تحديد طريقة ظهور عناصر الصفحة.
المثال الأول
<head> <style> h1 { color: red; } p { color: blue; } </style> </head> <body> <h1>This is a red heading</h1> <p>This is a blue paragraph.</p> </body>
في المثال التالي قمنا بإضافة وسم <script>
في الوسم <head>
و فيه وضعنا كود بلغة جافاسكربت يقوم بعرض رسالة ترحيب حين يتم تنفيذه. و بالمبدأ سيتم تنفيذ هذا الكود حين يتم النقر على الزر الموضوع في الصفحة.
المثال الثاني
<head> <script> function displayMessage() { alert('Hello User!'); } </script> </head> <body> <button onclick="displayMessage()">Click Me!</button> </body>
تصميمه الإفتراضي
بشكل عام جميع المتصفحات تعرضه بالتنسيق التالي.
head {
display: none;
}
نصائح و ملاحظات
الصفحة يجب أن تحتوي على <head>
واحد فقط مع الإشارة إلى أنه يمكن إضافة الوسوم التالية بداخله:
<title>
<style>
<base>
<link>
<meta>
<script>
<noscript>