العلامات الأساسية في HTML
في الـ HTML، كل صفحة بتبدأ بعلامة معينة بتحدد نوع المستند اللي هتكتب فيه كودك. خليني أوضح لك أهم العلامات اللي هتحتاج تعرفها:
<!DOCTYPE html>:- دي أول حاجة بنكتبها في أي صفحة HTML. هي بتقول للمتصفح “أنا هنا بكتب HTML5”.
<html>:- دي العلامة اللي بتحدد بداية الصفحة. كل المحتوى اللي هتكتب داخل الصفحة لازم يكون جوه العلامة دي.
<head>:- هنا بنضيف المعلومات اللي مش هتظهر للزوار بشكل مباشر. زي العنوان الخاص بالصفحة أو روابط لملفات CSS أو JavaScript.
- أهم حاجة هنا هي علامة العنوان
<title>، اللي بتخلي العنوان يظهر فوق التبويب في المتصفح.
<body>:- الجزء ده هو اللي بيحتوي على كل المحتوى اللي هيتعرض للمستخدم في الصفحة. يعني كل النصوص، الصور، الروابط، الجداول، وأي حاجة تانية.
الهيكل الأساسي لصفحة HTML بسيطة:
في البداية، الصفحة هتكون كده:
<!DOCTYPE html>
<html>
<head>
<title>أول صفحة HTML</title>
</head>
<body>
<h1>مرحبًا بكم!</h1>
<p>دي أول صفحة HTML بتاعتي.</p>
</body>
</html>
إزاي تكتب صفحة HTML؟
<!DOCTYPE html>: تحديد نوع المستند.<html>: بداية هيكل الصفحة.<head>: محتويات الصفحة (العنوانtitle).<body>: النصوص والمحتوى اللي هيتعرض على المتصفح.
إزاي تضيف عنوان؟
داخل الـ <head>, هتكتب عنوان الصفحة باستخدام <title>:
<head>
<title>أول صفحة HTML</title>
</head>
الفرق بين <head> و <body>
<head>: ده جزء مخصص للمعلومات اللي مش هتظهر للمستخدم مباشرة زي العنوان أو إعدادات المتصفح.<body>: هنا كل حاجة هتظهر على الشاشة زي النصوص والصور والجداول.
مثال توضيحي:
هنا مثال بسيط بيوضح الهيكل:
<!DOCTYPE html>
<html>
<head>
<title>أهلاً بك في HTML</title>
</head>
<body>
<h1>مرحبًا! ده عنوان كبير</h1>
<p>دي فقرة عادية بتظهر هنا في الصفحة.</p>
</body>
</html>
في الختام:
دلوقتي أنت فهمت كيف تكتب الهيكل الأساسي لصفحة HTML. بعد ما تعلمنا الـ <head> والـ <body>, فهمنا إزاي نحدد عنوان الصفحة، وإزاي نضيف المحتوى داخل الـ <body>. الخطوة الجاية هي إضافة عناصر أخرى زي النصوص والصور، وده هنشرحه في المقالات الجاية!
لو عندك أي أسئلة أو محتاج شرح أكتر في أي جزئية، قول لي.
اترك تعليقاً