أساسيات صياغة HTML
العناصر والوسوم والسمات والعناصر الفارغة وdoctype والتداخل الصحيح.
كل الدروس · دروس HTML: تعلّم من الصفر
العنصر والوسم والسمة
تعلّم HTML أجزاء الصفحة بالوسوم. يتكون العنصر من وسم فتح ومحتوى ووسم إغلاق: <p>مرحبًا</p>. ويخبر الوسم المتصفح أن «هذا النص فقرة».
تعطي السمة العنصر معلومات إضافية وتُكتب في وسم الفتح بالشكل name="value". وبعض العناصر فارغة بلا وسم إغلاق: <img> و<br> و<hr> و<input>.
<p class="note" lang="en">Hello, <strong>world</strong>!</p> <img src="logo.png" alt="Company logo"> <a href="https://example.com" target="_blank">Open</a>
هيكل الصفحة
لكل مستند HTML الهيكل نفسه: doctype وhtml وhead وbody. يحوي head معلومات عن الصفحة (العنوان والترميز) ويحوي body كل ما يراه الزائر.
<!DOCTYPE html>
<html lang="az">
<head>
<meta charset="utf-8">
<title>İlk səhifəm</title>
</head>
<body>
<h1>Salam, dünya!</h1>
<p>Bu, mənim ilk səhifəmdir.</p>
</body>
</html>قواعد الكتابة
- عشّش الوسوم بشكل صحيح: <p><em>…</em></p> وليس <p><em>…</p></em>.
- ضع قيم السمات بين علامات اقتباس.
- اكتب أسماء الوسوم بأحرف صغيرة.
- اكتب < و& في النص هكذا < و&.
يُكتب التعليق بين <!-- ... --> ولا يظهر. يختزل المتصفح المسافات وفواصل الأسطر إلى مسافة واحدة، لذا استخدم فقرات منفصلة بدل تكديس <br>.