Advertisements
HTML5 Attributes
العناصر في لغة HTML عمومًا لها سمات ؛ هذه قيم إضافية تقوم بتكوين العناصر أو تعديل سلوكها بطرق مختلفة لتلبية المعايير التي يريدها المستخدمون.
السمات Attributes
يتم تحديد بعض السمات بشكل عام ويمكن استخدامها على أي عنصر، بينما يتم تحديد سمات أخرى لعناصر محددة فقط.
جميع السمات لها اسم وقيمة، كالتالى:
<p class="demo">Hello HTML5!</p>
فى المثال السابق تم تمييز عنصر “p” بسمة تسمى class باستخدام قيمة “demo”.
سمات HTML5 غير حساسة لحالة الأحرف ويمكن كتابتها بأحرف capital أو small أو مختلطة، لكن من الأفضل الالتزام بالأحرف الصغيرة.
لا يجوز تحديد السمات إلا ضمن علامات البداية ويجب عدم استخدامها مطلقًا في علامات النهاية.
السمات المخصصة Custom Attributes
ميزة جديدة يتم تقديمها في HTML 5 هي إضافة سمات data المخصصة.
تبدأ سمة الـ data المخصصة بالـ –data ثم إسم البيانات الذى تريده (يتم تسميتها بناءً على متطلباتك).
مثال للتوضيح:
<div class="example" data-username="Mohamed" data-gender="Male">
....
</div>
ستكون قادرًا على الحصول على قيم هذه سمات (data) باستخدام JavaScript APIs أو CSS بنفس الطريقة التي تحصل عليها للسمات الأساسية.
قائمة ببعض السمات الأكثر إستخدامًا
| السمة | الإستخدام |
|---|---|
| class | غالبًا ما تستخدم مع CSS لتصميم عناصر ذات خصائص مشتركة. |
| id | غالبًا ما تستخدم مع CSS لتصميم عنصر معين. يجب أن تكون قيمة هذه السمة فريدة. |
| accesskey | اختصار لوحة المفاتيح للتنشيط أو إضافة التركيز إلى العنصر. |
| *-data | يتيح لك إرفاق سمات مخصصة بعنصر HTML. |
| align | يحدد المحاذاة الأفقية للعنصر. |
| height | يحدد ارتفاع العناصر. على سبيل المثال (إرتفاع صورة أو جدول أو ..إلخ). |
| width | يحدد عرض العناصر. على سبيل المثال (عرض صورة أو جدول أو ..إلخ). |
| name | اسم العنصر. على سبيل المثال يستخدمه الخادم لتحديد الحقول في عمليات إرسال النموذج. |
| pattern | يحدد regular expression ليتم التحقق من قيمة العنصر مقابله. |
| src | عنوان URL للمحتوى القابل للتضمين. |
| title | النص الذي سيتم عرضه في تلميح عند التمرير فوق العنصر. |
| value | تحدد القيمة الافتراضية التي سيتم عرضها في العنصر عند تحميل الصفحة. |
| hidden | يحدد ما إذا كان يجب أن يكون العنصر مرئيًا أم لا. |
| style | يحدد style مضمنًا لعنصر. |
| subject | يحدد العنصر المقابل للعنصر. |
| type | يحدد نوع العنصر. |
| target | يحدد مكان فتح المستند المرتبط (في حالة عنصر <a>) أو مكان عرض الاستجابة المستلمة (في حالة عنصر <form>) |
معظم السمات السابقة مدعومة من قبل جميع عناصر HTML5.
الإبلاغ عن خطأ
×إذا وجد خطأ وتريد الإبلاغ عن هذا الخطأ، أو إذا كنت تريد تقديم اقتراح على شىء معين، فلا تتردد في إرسال بريد إلكتروني إلينا:
info@albashmoparmeg.com
شكرًا لك على مساعدتك لنا!
Advertisements