بسم الله الرحمن الرحيم
هذه سلسلة من المواضيع التي سيتم نشرها في مجموعة من المنتديات التطويرية منقولة عن
مدرسة الويب العربي التي تترجم دروس الموقع العالمي
w3Schools .
------------------------------------
- اسم الدرس: عناصر HTML
- وصف الدرس: درس يشرح عناصر HTML, تكوينها وطريقة التعامل معها كما يشرح أنواع أنماط الاقتباس وأيضاُ الأوسمة الصغيرة و الكبيرة.
- القسم: HTML
------------------------------------
صفحات HTML ملفات نصية تم تكوينها من عناصر HTML.
عناصر HTML هي أوسمة بيانات محددة الاستخدام.
وسوم HTML- أوسمة HTML تستخدم لتكوين عناصر HTML.
- أوسمة HTML محاطة ما بين العلامتين < و >.
- العلامتين المحيطة بأوسمة HTML تسمى الأقواس الحادة.
- تأتي أوسمة HTML غالباً في شكل أزواج مثل <b> و </b>.
- الوسم الأول في الزوج هو وسم البداية, و الوسم الثاني في الزوج هو وسم النهاية.
- النص بين وسم البداية و النهاية هو محتوى العنصر
- أوسمة HTML ليست حساسة لحالة الأحرف, مثلاً <b> هو نفسه <B> و لا فرق بينهما.
عناصر HTML
نذكِّر بمثال HTML من الدرس السابق:
كود:
<html>
<head>
<title>عنوان الصفحة</title>
</head>
<body>
هذه صفحتي الأولى. <b>هذا النص عريض</b>
</body>
</html>
هذا مثال لعنصر HTML:
كود:
<b>هذا النص عريض</b>
يبدأ عنصر HTML مع وسم البداية: <b>
إن محتوى عنصر HTML هو: هذا النص عريض
ينتهي عنصر HTML مع وسم النهاية: </b>
إن الهدف من الوسم <b> هو تحديد عنصر HTML الذي تريده أن يُعرض في المتصفح على شكل نص عريض.
هذا أيضاً عنصر HTML:
كود:
<body>
هذه صفحتي الرئيسة الأولى. <b>هذا النص عريض</b>
</body>
يبدأ عنصر HTML هذا بوسم البداية <body>, و ينتهي بوسم النهاية </body>.
إن الهدف من وسم <body> هو تعريف عناصر HTML التي يحتويها جسم المستند.
لماذا نستخدم وسوم صغيرة؟
نحن قلنا قبل قليل أن وسوم HTML غير حساسة لحالة الأحرف: <B> هو تماماً <b>. عندما تتصفح الويب, ستلاحظ بأن أكثر الدروس تستخدم وسوم HTML الكبيرة في الأمثلة. نستخدم وسوم صغيرة دائماً. لماذا؟
إذا كنت تريد تهيئة نفسك للأجيال القادمة من HTML, يجب أن تبدأ باستخدام الأوسمة الصغيرة. جمعية الويب العالمية (W3C) توصي باستخدام الأوسمة الصغيرة في HTML 4, أما XHTML (الجيل الجديد من HTML) فيطلب بشكل إجباري استخدام الأوسمة الصغيرة.
خواص الوسم
الأوسمة يمكن أن يُضاف لها خواص. الخواص تقوم بإضافة معلومات حول عناصر HTML على صفحتك.
هذا الوسم يقوم بتعريف عنصر جسم الصفحة: <body>. عند إضافة خاصية bgcolor, أنت يمكن أن تخبر المتصفح بأن لون خلفية صفحتك أحمر عن طريق إسناد القيمة red للخاصية bgcolor داخل الوسم <body> ,هكذا: <body bgcolor="red">.
هذا الوسم يقوم بتعريف الجدول: <table>. عن إضافة خاصية border, أنت يمكن أن تخبر المتصفح بأن هذا الجدول بدون إطار عن طريق إسناد القسم صفر للخاصية border داخل الوسم <table>, وتكتب هكذا: <table border="0">
تأتي الخواص دائماً على شكل اسم/قيمة مثل: name="value".
الخواص تضاف دائماً إلى وسم البداية في عنصر HTML.
نمط الاقتباس, "red" أو 'red' ؟
قيم الخواص يجب أن تكون دائماً بين علامات اقتباس. علامات الاقتباس الزوجية هي الأكثر انتشاراً, لكن علامات الاقتباس المفردة مسموح بها أيضاُ.
في بعض الحالات النادرة, مثل عندما تكون قيمة الخاصية تحتوي على علامات اقتباس, في هذه الحالة تستطيع استخدام علامات الاقتباس المفردة:
name='John "ShotGun" Nelson'
المصدر الإنجليزي : W3Schools
تم الترجمة بواسطة:
مدرسة الويب العربي
روابط تهمك:
مدرسة الويب العربي