تنسيق الوسوم TAGS

عند رؤيتك للامثلة السابقة هل لاحضت وجود نمط معين في شكل تنسيق الاكواد الخاصة بhtml؟ توجد قاعدة تطبق على اغلب وسوم HTML وهي فتح الوسم المخصص بين علامتي اكبر واصغر<tag> واغلاقه بوضع الخط المائل الى اليمين في يسار الوسم بعد إشارة "اكبر" </tag> , الان بالتأكيد هذه القاعدة لاتطبق على كل الوسوم فهنالك مثلا التعليمة

<!DOCTYPE html> هذه التعلمية للأشارة على أن الملف بصيغة 5 HTML. ولاتغلق بقوس مائل بل تكتب وفقط

شاهد المثال الاتي على تنسيق الوسوم في لغة HTML5:

<html>
<head>
  <title>
  </title>
</head>
<body>
   <h1>
   moml
    </h1>
<i> moml  </i>
<div>
  <button>
</button>
</div>
</body>
</html>

لاحض امتلاك الوسوم <html> و<head>و<div>و<i>و<h2>و<title> وسوم نهاية مخصصة بالخط المائل "/" عند اغلاقها بينما الوسم <link> غير مغلق في ضاهره لكنها احد خواص HTML المضافة لعدم وجود الحاجة لأعلام المتصفح باغلاق الوسم هذا ويوجد العديد من الاوسمة الغير منتهية بالاغلاق الشائع "/" مثل <img> الخاص بادراج الصور في الصفحة أيضا يرجع السبب لعدم الحاجة الى الأغلاق , ربما تتسائل مالذي يحصل عند عدم اغلاق الوسم الواجب اغلاقه في HTML ؟ في المثال التالي لقد كتبت الوسم <button> في منطقة <body></body> وهو الوسم الخاص بخلق زر بدائي التصميم (بدون تعديلات Css)بدون اغلاقه وكتبت وسم ) <h1> الذي هو احد تدرجات H الستة في اختيار حجم النصوص وهو الذي يحدد اكبر حجم للنص ( بعده مباشرة شاهد التعليمات الاتية :

<html>
<head>
</head>
<body>

  <button>
<h1>


</body>
</html>

نحن نريد فصل الزر عن النص ولكن هذه مايحصل عند عدم اغلاق الاوسمة الواجب اغلاقها فقد ادرج <h1> داخل <button> وفقد خاصية النسخ والصق , دعنا نستمر بالكتابة دون اغلاق ..

<html>
<head>
</head>
<body>

  <button>
  moml
<h1>
mohmmed
<i>
 reade


</body>
</html>

ستكون نتيجة بشعة جدا الان بالتأكيد ان المخرجات في الصفحة سيئة جدا وغير منضمة لكن لاحض ولوج وتداخل الوسم <h1> مع <button> والوسم <li> (والذي هو خاص بتعليم المتصفح وجود نقطة ماقبل السطر ) مع الوسم <h1> لا بل انه اخذ خصائص H1في الحجم وادرج داخل الزر Button ,