تتضمن لغة HTML عددًا من العناصر. وتشمل هذه شائعة الاستخدام مكونات الموقع مثل الفقرات والعناوين والروابط والصور. هناك أيضًا عدد من العناصر الأحدث التي تم تقديمها مع HTML5 ، بما في ذلك الرأس والتنقل والتذييل والمزيد. تُستخدم كل عناصر HTML هذه لإنشاء بنية المستند وإعطائه معنى. لإضافة المزيد من المعاني إلى العناصر ، يمكنك منحها سمات.
تبدأ علامة فتح HTML الأساسية بالحرف <.>. على سبيل المثال ، سيتم كتابة علامة فتح الفقرة على النحو التالي:
لإضافة سمة إلى ملف علامة HTML، عليك أولاً وضع مسافة بعد اسم العلامة (في هذه الحالة يكون هذا هو "p"). ثم يمكنك إضافة اسم السمة الذي ترغب في استخدامه متبوعًا بعلامة التساوي. أخيرًا ، سيتم وضع قيمة السمة بين علامات اقتباس. على سبيل المثال:
يمكن أن تحتوي العلامات على سمات متعددة. ستقوم بفصل كل سمة عن السمات الأخرى بمسافة.
العناصر ذات السمات المطلوبة
تتطلب بعض عناصر HTML في الواقع سمات إذا كنت تريد أن تعمل على النحو المنشود. عنصر الصورة وعنصر الارتباط مثالان على ذلك.
ال عنصر الصورة يتطلب السمة "src". تخبر هذه السمة المتصفح بالصورة التي تريد استخدامها في هذا الموقع. ستكون قيمة السمة عبارة عن مسار ملف للصورة. على سبيل المثال:
ستلاحظ أننا أضفنا سمة أخرى إلى هذا العنصر ، "alt" أو سمة النص البديل. هذه ليست سمة مطلوبة من الناحية الفنية للصور ، ولكن من أفضل الممارسات تضمين هذا المحتوى دائمًا لإمكانية الوصول. النص المدرج في قيمة سمة النص البديل هو ما سيتم عرضه في حالة وجود ملف فشل تحميل الصورة لسبب ما.
عنصر آخر يتطلب سمات محددة هو علامة الارتساء أو الرابط. يجب أن يشتمل هذا العنصر على سمة "href" ، والتي تعني "مرجع النص التشعبي". وهذه طريقة رائعة للقول "أين يجب أن ينتقل هذا الرابط. "تمامًا مثلما يحتاج عنصر الصورة إلى معرفة الصورة المراد تحميلها ، يجب أن تعرف علامة الارتباط المكان الذي تريده ل. إليك الشكل الذي قد تبدو عليه علامة الارتباط:
سيؤدي هذا الارتباط الآن إلى جلب شخص إلى موقع الويب المحدد في قيمة السمة. في هذه الحالة ، هي الصفحة الرئيسية لـ Dotdash.
السمات مثل خطافات CSS
استخدام آخر للسمات هو عندما يتم استخدامها كـ "خطافات" لـ أنماط CSS. لأن معايير الويب تملي عليك الاحتفاظ ببنية صفحتك (HTML) منفصلة عن أنماطها (CSS) ، يمكنك استخدام خطاطيف السمات هذه في CSS لإملاء كيفية عرض الصفحة المهيكلة في الويب المتصفح. على سبيل المثال ، يمكن أن يكون لديك هذا الجزء من الترميز في مستند HTML الخاص بك.
إذا كنت تريد أن يكون لهذا التقسيم لون خلفية أسود (# 000) وحجم خط 1.5em ، يمكنك إضافة هذا إلى CSS الخاص بك:
.featured {background-color: # 000؛ حجم الخط: 1.5em؛}
تعمل سمة الفئة "المميزة" كخطاف نستخدمه في CSS لتطبيق الأنماط على تلك المنطقة. يمكننا أيضًا استخدام سمة معرف هنا إذا أردنا. تعد كل من الفئات والمعرفات سمات عامة ، مما يعني أنه يمكن إضافتها إلى أي عنصر. يمكن أيضًا استهدافهما بأنماط CSS محددة لتحديد المظهر المرئي لهذا العنصر.
بخصوص جافا سكريبت
أخيرًا ، استخدام السمات على عناصر HTML معينة هو أيضًا شيء يمكنك استخدامه في Javascript. إذا كان لديك برنامج نصي يبحث عن عنصر بسمة معرف معينة ، فهذا يعد استخدامًا آخر لهذا الجزء الشائع من لغة HTML.