الآن أنت جاهز لتعلم جوهر لغة HTML وهي العناصر.
العناصر تعطي لوثائق HTML هيكلية محددة وتخبر المتصفح عن كيفية عرض الصفحة، بشكل عام العناصر عبارة عن وسم "tag" للبداية ثم بعض المحتويات ثم وسم الإغلاق.
كل الوسوم لها نفس نفس الشكل، تبدأ مع علامة أصغر من "<" وتنتهي مع علامة أكبر من ">".
بشكل عام هناك نوعان من الوسوم، وسم البداية: <html> ثم وسم الإغلاق </html>. الفرق بين الإثنين هي علامة "/"، توصيف المحتويات يكون بوضعها بين وسم البداية ووسم الإغلاق.
لغة HTML تتكون من هذه العناصر، لكي تتعلم HTML عليك أن تتعلم وتستخدم وسوماً مختلفة.
المثال 1:
سيظهر بهذا الشكل في المتصفح:
مثال 2:
ستظهر بهذا الشكل في المتصفح:
إذا انتقلت إلى الدرس اللاحق ستتمكن من إنشاء موقعك خلال عشر دقائق.
العناصر تعطي لوثائق HTML هيكلية محددة وتخبر المتصفح عن كيفية عرض الصفحة، بشكل عام العناصر عبارة عن وسم "tag" للبداية ثم بعض المحتويات ثم وسم الإغلاق.
"وسوم"؟
الوسوم هي توصيفات تستخدمها لكي تضعها في بداية العنصر وعند نهايته.كل الوسوم لها نفس نفس الشكل، تبدأ مع علامة أصغر من "<" وتنتهي مع علامة أكبر من ">".
بشكل عام هناك نوعان من الوسوم، وسم البداية: <html> ثم وسم الإغلاق </html>. الفرق بين الإثنين هي علامة "/"، توصيف المحتويات يكون بوضعها بين وسم البداية ووسم الإغلاق.
لغة HTML تتكون من هذه العناصر، لكي تتعلم HTML عليك أن تتعلم وتستخدم وسوماً مختلفة.
هل يمكنك أن تريني بعض الأمثلة؟
حسناً، العنصرem
يشدد النص "يجعله مائلاً" وكل النصوص بين وسم البداية <em>
ووسم الإغلاق </em>
ستظهر بشكل مائل في المتصفح. ("em" هي اختصار "emphasis".)المثال 1:
<em>نص مائل.</em>
نص مائل.
العناصر h1
، h2
، h3
، h4
، h5
وh6
تستخدم للعناوين (حرف h هو اختصار "heading"), حيث h1
هو المستوى الأول من العناوين وبالتالي الأكبر حجماً، h2
يستخدم للمستوى الثاني من العناوين وهو أصغر حجماً بقليل، وh6
هو المستوى السادس والأخير من هيكلية العناوين وهو الأصغر.مثال 2:
<h1>هذا عنوان</h1>
<h2>هذا عنوان فرعي</h2>
هذا عنوان
هذا عنوان فرعي
هل أنا بحاجة دائماً إلى استخدام وسم بداية ووسم إغلاق؟
كما يقولون، هناك استثناء من كل قاعدة، والاستثناء في HTML هو وجود عناصر تعتبر هي وسم البداية ووسم الإغلاق في نفس الوقت، وهي تسمى العناصر الفارغة لأنها غير مرتبطة بنص معين لكنها عناصر مستقلة تماماً، فمثلاً هناك وسم لكي لكسر النص وإجباره على الظهور في سطر جديد، هذا الوسم يظهر بهذا الشكل:<br />
.هل تكتب الوسوم بأحرف كبيرة أم صغيرة؟
معظم المتصفحات لن تهتم إذا كتبت الوسوم بأحرف كبيرة أو صغيرة أو خليط بين الإثنين، <HTML>، <html> أو <HtMl> كلها ستعطي نفس النتائج، مع ذلك الأسلوب الصحيح هو كتابة الوسوم بالأحرف الصغيرة، لذلك عليك أن تعتاد على كتابة الوسوم بالأحرف الصغيرة.أين أضع كل هذه الوسوم؟
أكتب الوسوم في وثيقة HTML، المواقع تحوي وثيقة HTML أو أكثر، عندما تتصفح شبكة الويب أنت فقط تقوم بفتح وثائق HTML مختلفة.إذا انتقلت إلى الدرس اللاحق ستتمكن من إنشاء موقعك خلال عشر دقائق.
درس HTML - جدول المحتويات
- مقدمة
مقدمة قصيرة للدرس وما يمكن أن تتعلم فيه. - الدرس الأول: لنبدأ
تعرف على الأدوات التي تحتاجها لإنشاء موقعك. - الدرس الثاني: ما هي HTML؟
تعرف على HTML وما تعنيه. - الدرس الثالث: العناصر والوسوم؟
ما هي العناصر والوسوم وفي ما تستخدم. - الدرس الرابع: إنشاء موقعك الأول
تعلم إنشاء وثيقة HTML الأولى - القالب الأساسي للصفحات الأخرى. - الدرس الخامس: ماذا تعلمت حتى الآن؟
ملخص ما تعلمته حتى الآن وما ستتعلمه في الدروس القادمة. - الدرس السادس: المزيد من العناصر
تعرف على العناصر السبعة الأكثر استخداماً. - الدرس السابع: الخصائص
تعلم إضافة المزيد من المعلومات للوسوم وتكوين أوامر واضحة. - الدرس الثامن: الروابط
اكتشف كيف تقوم بإنشاء رابط بين صفحتك وأي صفحة على الإنترنت. - الدرس التاسع: الصور
اكتشف كم هو سهل وبسيط أن تضيف صوراً لصفحتك. - الدرس العاشر: الجداول
قم بإنشاء الجداول لعرض المحتويات. - الدرس الحادي عشر: المزيد حول الجداول
المزيد من الأوامر المتقدمة لإنشاء الجداول. - الدرس الثاني عشر: التصميم (CSS)
استوعب كيف يمكن لتقنية CSS أن تستخدم لإنشاء تصميم لصفحتك. - الدرس الثالث عشر: نشر الصفحات
نشر صفحاتك على الإنترنت ليستطيع الآخرون الإطلاع عليها. - الدرس الرابع عشر: المعايير القياسية
تعلم المعايير القياسية للغة HTML وكيف تتأكد بأن ما كتبته صحيح. - الدرس الخامس عشر: النصائح الأخيرة
نصائح مختلفة لموقع أفضل.
ليست هناك تعليقات:
إرسال تعليق