الكورس

Advertisements

HTML Attribute Reference


HTML Attribute Reference – مرجع بجميع سمات لغة HTML.


 

HTML Attribute Reference

 

السمات Attributes تخبرنا بالمزيد من المعلومات والتفاصيل حول محتوى كل عنصر. لذلك فى الجدول التالى جميع سمات لغة HTML، مع تحديد العنصر (أو العناصر) الذى تنتمى لكل سمة مع وصفها.

 

السمات

السمةالعنصر الذى ينتمى لهالوصف
accept<form> – <input>يحدد قائمة بأنواع الملفات التي يقبلها الخادم ، وتستخدم مع [“type=”file] دائمًا.
accept-charset<form>يحدد ترميزات الأحرف التي سيتم استخدامها لإرسال النموذج.
accesskeyالسمات العامة – Global Attributesيحدد مفتاح الاختصار لتنشيط أو تركيز عنصر.
action<form>يحدد مكان إرسال بيانات النموذج عند إرسال النموذج لمعالجة البيانات.
align<img> – <table> – <tbody>
<td> – <tfoot> – <th>
<thead> – <tr> – <applet>
<caption> – <col> – <iframe>
<hr> – <colgroup>
يحدد المحاذاة الأفقية للعنصر.
allow<iframe>يحدّد سياسة ميزة feature-policy لإطار iframe.
alt<applet> – <img> – <input> – <area>يحدد نصًا بديلاً عند فشل عرض العنصر الأصلي.
async<script>يحدد أن البرنامج النصي script يتم تنفيذه بشكل غير متزامن [مع الـ scripts الخارجية].
autocapitalizeالسمات العامة – Global Attributesيحدد ما إذا كان سيتم كتابة الإدخال تلقائيًا عند إدخاله بواسطة المستخدم.
autocomplete<form> – <input> – <select> – <textarea>يحدد ما إذا كان بإمكان المستعرض إكمال قيم عناصر التحكم في هذا النموذج افتراضيًا.
autofocus<form> – <input> – <select> – <textarea>يحدد أن العنصر يجب أن يحصل تلقائيًا على التركيز عند تحميل الصفحة.
autoplay<video> – <audio>يحدد بدء تشغيل الصوت أو الفيديو بمجرد أن يصبح جاهزًا.
background<table> – <td> – <th> – <body>يحدد عنوان URL لملف الصورة.
bgcolor<table> – <td> – <tfoot>
<th> – <tr> – <body>
<col> – <colgroup> – <tbody>
يحدد لون خلفية العنصر.
border<table> – <img> – <object>يحدد عرض حد العنصر.
buffered<video> – <audio>يحتوي على النطاق الزمني للوسائط المخزنة بالفعل.
charset<script> – <meta>يحدد ترميز الأحرف.
checked<input>تحدد أنه يجب تحديد عنصر مسبقًا عند تحميل الصفحة [خصوصًا مع “type = “checkbox أو “type = “radio].
cite<blockquote> – <del> – <ins> – <q>يحدد عنوان URL الذي يشرح نص الاقتباس أو النص المحذوف / المدرج.
classالسمات العامة – Global Attributesيحدد اسم فئة واحدًا أو أكثر لعنصر، غالبًا ما يُستخدم مع CSS لتصميم العناصر.
code<applet>يحدد عنوان URL لملف فئة التطبيق الصغير applet ليتم تحميله وتنفيذه.
codebase<applet>يحدد عنوان URL المطلق أو النسبي للدليل حيث يتم تخزين ملفات class. الخاصة بالتطبيقات المشار إليها بواسطة سمة code.
color<hr> – <basefont> – <font>يحدد لون النص للعنصر.
cols<textarea>يحدد العرض المرئي لمنطقة النص.
colspan<td> – <th>يحدد عدد الأعمدة التي يجب أن تمتد خلية الجدول إليها.
content<meta>يعطي القيمة المرتبطة بـ http-equiv أو سمة name.
contenteditableالسمات العامة – Global Attributesيحدد ما إذا كان محتوى عنصر ما قابلاً للتحرير أم لا.
contextmenuالسمات العامة – Global Attributesيحدد ID عنصر <menu> الذي سيكون بمثابة قائمة سياق العنصر.
controls<video> – <audio>يحدد أنه يجب عرض عناصر التحكم في الصوت أو الفيديو.
coords<area>يحدد إحداثيات المنطقة.
crossorigin<video> – <audio> – <script> – <img> – <link>يحدد كيفية تعامل العنصر مع طلبات cross-origin.
csp<iframe>يحدد سياسة أمان المحتوى التي يجب أن توافق المستند المضمن على فرضها على نفسها.
data<object>يحدد عنوان URL للمورد الذي سيستخدمه الكائن.
*-dataالسمات العامة – Global Attributesيستخدم لتخزين البيانات المخصصة الخاصة بالصفحة أو التطبيق.
datetime<del> – <ins> – <time>يحدد التاريخ والوقت.
decoding<img>يحدد الطريقة المفضلة لفك تشفير الصورة.
default<track>يحدد أن المسار سيتم تمكينه إذا كانت تفضيلات المستخدم لا تشير إلى أن مسارًا آخر سيكون أكثر ملاءمة.
defer<script>يحدد أن البرنامج النصي يتم تنفيذه عندما تنتهي الصفحة من التحليل [مع الـ scripts الخارجية].
dirالسمات العامة – Global Attributesيحدد اتجاه النص للمحتوى في عنصر ما.
dirname<input> – <textarea>يحدد أن اتجاه النص سيتم تقديمه.
disabled<input> – <select> – <textarea>
<option> – <fieldset>
<optgroup> – <button>
يحدد أنه يجب تعطيل العنصر أو مجموعة العناصر المحددة.
download<area> – <a>يحدد أن الهدف سيتم تنزيله عندما ينقر المستخدم على الرابط التشعبي.
draggableالسمات العامة – Global Attributesيحدد ما إذا كان العنصر قابلاً للسحب أم لا.
enctype<form>يحدد كيفية تشفير بيانات النموذج عند إرسالها إلى الخادم، وتستخدم مع [“method=”post] فقط.
for<label> – <output>يحدد عنصر/عناصر النموذج المرتبط به التسمية أو الحساب.
form<label> – <output> – <input>
<select> – <textarea> – <fieldset>
<button> – <meter> – <object>
يحدد اسم النموذج الذي ينتمي إليه العنصر.
formaction<input> – <button>يحدد مكان إرسال بيانات النموذج عند إرسال النموذج، وتستخدم مع [“type=”submit] فقط.
formenctype<input> – <button>يحدد نوع الترميز المراد استخدامه أثناء إرسال النموذج، وتستخدم مع [“type=”submit] فقط.
formmethod<input> – <button>يحدد طريقة إرسال بيانات النموذج أثناء إرسال النموذج (GET ، POST ، إلخ)، وتستخدم مع [“type=”submit] فقط.
formnovalidate<input> – <button>يحدد أنه يجب عدم التحقق من صحة النموذج عند إرساله، وتستخدم مع [“type=”submit] فقط.
formtarget<input> – <button>يحدد سياق التصفح (مثل: علامة التبويب أو النافذة أو الإطار المضمن) لعرض الاستجابة التي تم تلقيها بعد إرسال النموذج، وتستخدم مع [“type=”submit] فقط.
headers<td> – <th>تحدد خلية رؤوس واحدة أو أكثر ترتبط بها الخلية.
height<iframe> – <object>
<input> – <canvas> – <embed>
<video> – <img>
يحدد ارتفاع العنصر.
hiddenالسمات العامة – Global Attributesيحدد أن العنصر لم يعد ملائمًا بعد أو لم يعد مناسبًا.
high<meter>يحدد النطاق الذي يعتبر ذا قيمة عالية.
href<area> – <a> – <link> – <base>يحدد عنوان URL للصفحة التي ينتقل إليها الارتباط.
hreflang<area> – <a> – <link>يحدد لغة المستند المرتبطة.
http-equiv<meta>يوفر HTTP header للمعلومات أو القيمة الخاصة بسمة content.
idالسمات العامة – Global Attributesيحدد معرفًا فريدًا للعنصر.
importance<link> – <iframe> – <img> – <script>يشير إلى أولوية الجلب النسبية للمورد.
integrity<link> -<script>يحدد قيمة تكامل الموارد الفرعية التي تسمح للمتصفحات بالتحقق مما تجلبه.
inputmode<textarea>يوفر تلميحًا بشأن نوع البيانات التي قد يُدخلها المستخدم أثناء تحرير العنصر أو محتوياته.
ismap<img>يحدد صورة كخريطة صورة من جانب الخادم.
kind<track>يحدد نوع مسار النص.
label<track> – <option> – <fieldset>يحدد عنوان العنصر الذي يمكن للمستخدم قراءته.
langالسمات العامة – Global Attributesيحدد اللغة المستخدمة في العنصر.
language<script>يحدد لغة البرنامج النصي script المستخدمة في العنصر.
loading<img> – <iframe>يشير إلى ما إذا كان يجب تحميل العنصر:
ببطء [“loading=”lazy].
– أو على الفور [“loading=”eager].
list<input>يشير إلى عنصر <datalist> الذي يحتوي على خيارات محددة مسبقًا لعنصر <input>.
loop<video> – <audio>يحدد أن الصوت أو الفيديو سيبدأ من جديد ، في كل مرة ينتهي فيها.
low<meter>يحدد النطاق الذي يعتبر ذا قيمة منخفضة.
manifest<html>يحدد عنوان URL لبيان ذاكرة التخزين المؤقت للمستند.
max<meter> – <progress> – <input>يحدد القيمة القصوى.
maxlength<input> – <textarea>يحدد الحد الأقصى لعدد الأحرف المسموح به في العنصر.
minlength<input> – <textarea>يحدد الحد الأدنى لعدد الأحرف المسموح به في العنصر.
media<a> – <area> – <link> – <source> – <style>يحدد نوع الوسائط أو الجهاز الذي تم تحسين المستند المرتبط من أجله.
method<form>تحدد طريقة HTTP لاستخدامها عند إرسال بيانات النموذج.
min<meter> – <input>يحدد الحد الأدنى للقيمة.
multiple<input> – <select>يحدد أن المستخدم يمكنه إدخال أكثر من قيمة واحدة.
muted<video> – <audio>يحدد أنه يجب كتم صوت إخراج الصوت للفيديو.
name<iframe> <object> – <input>
<select> <fieldset> – <meta>
<param> – <map> – <form>
<button> – <output> – <textarea>
يحدد اسم العنصر.
novalidate<form>تحدد أنه لا ينبغي التحقق من صحة النموذج عند إرساله.
onabort<video> – <audio> – <embed>
<img> – <object>
تحدد script ليتم تشغيله إذا توقف تحميل ملف الوسائط.
onafterprint<body>تحدد script المراد تشغيله بعد طباعة المستند.
onbeforeprint<body>تحدد script المراد تشغيله قبل طباعة المستند.
onbedoreunload<body>تحدد script الذي سيتم تشغيله عندما يكون المستند على وشك الإنتهاء من التحميل.
onblurتستخدم مع كل عناصر HTML المرئية.تحدد script ليتم تشغيله عندما يفقد العنصر التركيز.
oncanplay<video> – <audio> – <embed> – <object>تحدد script ليتم تشغيله عندما يكون الملف جاهزًا لبدء التشغيل.
oncanplaythrough<video> – <audio>تحدد script الذي سيتم تشغيله عندما يمكن تشغيل الملف بالكامل حتى النهاية دون التوقف مؤقتًا للتخزين المؤقت.
onchangeتستخدم مع كل عناصر HTML المرئية.تحدد script ليتم تشغيله عند تغيير قيمة العنصر.
onclickتستخدم مع كل عناصر HTML المرئية.تحدد script ليتم تشغيله عند النقر فوق العنصر.
oncontextmenuتستخدم مع كل عناصر HTML المرئية.تحدد script ليتم تشغيله عند تشغيل قائمة السياق context menu.
oncopyتستخدم مع كل عناصر HTML المرئية.تحدد script ليتم تشغيله عند نسخ محتوى العنصر.
oncuechange<track>تحدد script ليتم تشغيله عندما يتغير التلميح في عنصر <track>.
oncutتستخدم مع كل عناصر HTML المرئية.تحدد script ليتم تشغيله عند قص محتوى العنصر.
ondbclickتستخدم مع كل عناصر HTML المرئية.تحدد script الذي سيتم تشغيله عند النقر المزدوج على العنصر.
ondragتستخدم مع كل عناصر HTML المرئية.تحدد script ليتم تشغيله عند سحب العنصر.
ondragendتستخدم مع كل عناصر HTML المرئية.تحدد script ليتم تشغيله في نهاية عملية السحب.
ondragcenterتستخدم مع كل عناصر HTML المرئية.تحدد script ليتم تشغيله عند سحب عنصر إلى هدف إفلات صالح.
ondragleaveتستخدم مع كل عناصر HTML المرئية.تحدد script ليتم تشغيله عندما يترك عنصر هدف إسقاط صالحًا.
ondragoverتستخدم مع كل عناصر HTML المرئية.تحدد script ليتم تشغيله عند سحب عنصر فوق هدف إسقاط صالح.
ondragstartتستخدم مع كل عناصر HTML المرئية.تحدد script الذي سيتم تشغيله في بداية عملية السحب.
ondropتستخدم مع كل عناصر HTML المرئية.تحدد script الذي سيتم تشغيله عند إسقاط العنصر المسحوب.
ondurationchange<video> – <audio>تحدد script الذي سيتم تشغيله عند تغيير طول الوسائط.
onemptied<video> – <audio>تحدد script ليتم تشغيله عندما يحدث شيء غير متوقع والملف غير متاح فجأة.
onended<video> – <audio>تحدد script يتم تشغيلة عندما تصل الوسائط إلى النهاية.
onerror<video> – <audio> – <embed>
<img> – <object> – <body>
<style> – <script>
تحدد script ليتم تشغيله عند حدوث خطأ.
onfocusتستخدم مع كل عناصر HTML المرئية.تحدد script ليتم تشغيله عند التركيز على العنصر.
onhashchange<body>تحدد script ليتم تشغيله عندما تكون هناك تغييرات في جزء anchor (يبدأ بالرمز “b“) من عنوان URL الحالي.
oninputتستخدم مع كل عناصر HTML المرئية.تحدد script ليتم تشغيله عندما يحصل العنصر على مدخلات المستخدم.
oninvalidتستخدم مع كل عناصر HTML المرئية.تحدد script ليتم تشغيله عندما يكون العنصر غير صالح.
onkeydownتستخدم مع كل عناصر HTML المرئية.تحدد script ليتم تشغيله عندما يضغط المستخدم على مفتاح ولم يتركه بعد (على لوحة المفاتيح).
onkeypressتستخدم مع كل عناصر HTML المرئية.تحدد script ليتم تشغيله عندما يضغط المستخدم على مفتاح (على لوحة المفاتيح).
onkeyupتستخدم مع كل عناصر HTML المرئية.تحدد script ليتم تشغيله عندما يقوم المستخدم بتحرير المفتاح (على لوحة المفاتيح).
onload<link> – <img> – <input>
<body> – <style> – <script>
تحدد script ليتم تشغيله عند انتهاء تحميل العنصر.
onloadeddata<video> – <audio>تحدد script ليتم تشغيله عند تحميل بيانات الوسائط.
onloadedmetadata<video> – <audio>تحدد script ليتم تشغيله عند تحميل البيانات الوصفية.
onloadstart<video> – <audio>تحدد script ليتم تشغيله تمامًا كما يبدأ تحميل الملف قبل تحميل أي شيء فعليًا.
onmousedownتستخدم مع كل عناصر HTML المرئية.تحدد script ليتم تشغيله عند الضغط على زر الماوس لأسفل على عنصر.
onmousemoveتستخدم مع كل عناصر HTML المرئية.تحدد script ليتم تشغيله طالما أن مؤشر الماوس يتحرك فوق عنصر.
onmouseoutتستخدم مع كل عناصر HTML المرئية.تحدد script ليتم تشغيله عندما يتحرك مؤشر الماوس خارج العنصر.
onmouseoverتستخدم مع كل عناصر HTML المرئية.تحدد script ليتم تشغيله عندما يتحرك مؤشر الماوس فوق عنصر.
onmouseupتستخدم مع كل عناصر HTML المرئية.تحدد script ليتم تشغيله عند تحرير زر الماوس فوق عنصر.
onmousewheelتستخدم مع كل عناصر HTML المرئية.تحدد script ليتم تشغيله عند تمرير عجلة الماوس فوق عنصر.
onoffline<body>تحدد script ليتم تشغيله عندما يبدأ المتصفح في العمل دون اتصال بالإنترنت.
ononline<body>تحدد script ليتم تشغيله عندما يبدأ المتصفح في العمل عبر الإنترنت.
onpagehide<body>تحدد script الذي سيتم تشغيله عندما ينتقل المستخدم بعيدًا عن الصفحة.
onpageshow<body>تحدد script الذي سيتم تشغيله عندما ينتقل المستخدم إلى الصفحة.
onpasteتستخدم مع كل عناصر HTML المرئية.تحدد script ليتم تشغيله عندما يلصق المستخدم بعض المحتوى في عنصر.
onpause<video> – <audio>تحدد script ليتم تشغيله عند إيقاف الوسائط مؤقتًا إما من قبل المستخدم أو برمجيًا.
onplay<video> – <audio>تحدد script ليتم تشغيله عند بدء تشغيل الوسائط.
onplaying<video> – <audio>تحدد script ليتم تشغيله عند بدء تشغيل الوسائط.
onpopstate<body>تحدد script ليتم تشغيله عند تغيير محفوظات النافذة.
onprogress<video> – <audio>تحدد script ليتم تشغيله عندما يكون المتصفح في طور الحصول على بيانات الوسائط.
onratechange<video> – <audio>تحدد script ليتم تشغيله في كل مرة يتغير فيها معدل التشغيل.
onreset<form>تحدد script الذي سيتم تشغيله عند النقر فوق زر إعادة التعيين في نموذج ما.
onresize<body>تحدد script ليتم تشغيله عند تغيير حجم نافذة المتصفح.
onscrollتستخدم مع كل عناصر HTML المرئية.تحدد script الذي سيتم تشغيله عند تمرير شريط التمرير لأحد العناصر.
onsearch<input>تحدد script ليتم تشغيله عندما يكتب المستخدم شيئًا ما في حقل البحث، وتستخدم مع [<“input type=”search>].
onseeked<video> – <audio>تحدد script المراد تشغيله عند تعيين سمة onseeking على “false” للإشارة إلى انتهاء الـ seeking.
onseeking<video> – <audio>تحدد script المراد تشغيله عند تعيين سمة onseeking على “true” للإشارة إلى أن seeking نشط.
onselectتستخدم مع كل عناصر HTML المرئية.تحدد script ليتم تشغيله عند تحديد العنصر.
onstalled<video> – <audio>تحدد script ليتم تشغيله عندما يتعذر على المستعرض جلب بيانات الوسائط لأي سبب من الأسباب.
onstorage<body>تحدد script ليتم تشغيله عند تحديث منطقة تخزين الويب.
onsubmit<form>تحدد script ليتم تشغيله عند تقديم النموذج.
onsuspend<video> – <audio>تحدد script المراد تشغيله عند إيقاف جلب بيانات الوسائط قبل أن يتم تحميلها بالكامل لأي سبب من الأسباب.
ontimeupdate<video> – <audio>تحدد script ليتم تشغيله عند تغيير موضع التشغيل.
ontoggle<details>تحدد script ليتم تشغيله عندما يفتح المستخدم أو يغلق عنصر <details>.
onunload<body>تحدد script ليتم تشغيله عند إلغاء تحميل الصفحة أو إغلاق نافذة المتصفح.
onvolumechange<video> – <audio>تحدد script الذي سيتم تشغيله في كل مرة يتم فيها تغيير حجم الفيديو أو الصوت.
onwaiting<video> – <audio>تحدد script ليتم تشغيله عندما تتوقف الوسائط مؤقتًا ولكن من المتوقع أن تستأنف.
onwheelتستخدم مع كل عناصر HTML المرئية.تحدد script ليتم تشغيله عندما تتحرك عجلة الماوس لأعلى أو لأسفل فوق عنصر.
open<details>يحدد ما إذا كانت التفاصيل details ستظهر عند تحميل الصفحة.
optimum<meter>تحدد القيمة الرقمية المثلى.
pattern<input>يحدد regular expression سيتم التحقق من قيمة العنصر مقابله.
ping<area> – <a>تحدد قائمة بعناوين URL مفصولة بمسافات ليتم إعلامها إذا اتبع المستخدم الرابط التشعبي.
placeholder<input> – <textarea>يقدم تلميحًا للمستخدم لما يمكن إدخاله في الحقل.
poster<video>يحدد الصورة التي سيتم عرضها أثناء تنزيل الفيديو ، أو حتى يضغط المستخدم على زر التشغيل.
preload<video> – <audio>يحدد ما إذا كان يجب تحميل المورد بالكامل أو أجزاء منه أو لا شيء مسبقًا.
readonly<input> – <textarea>يحدد أن العنصر للقراءة فقط.
referrerpolicy<area> – <a> – <iframe>
<link> – <img> – <script>
يحدد المرجع الذي سيتم إرساله عند جلب المورد.
rel<link> – <area> – <a> – <form>يحدد العلاقة بين المستند الحالي والمستند المرتبط.
required<input> – <textarea> – <select>يحدد أنه يجب ملء العنصر قبل إرسال النموذج.
reversed<ol>تحديد أن ترتيب القائمة يجب أن يكون تنازليًا (من الأكبر لـ الأصغر).
rows<textarea>يحدد عدد الصفوف في منطقة النص.
rowspan<td> – <th>يحدد عدد الصفوف التي يجب أن تمتد خلية الجدول إليها.
sandbox<iframe>يوقف المستند الذي تم تحميله في iframe من استخدام ميزات معينة (مثل إرسال النماذج أو فتح نوافذ جديدة).
scope<th>تحدد ما إذا كانت خلية الرأس عبارة عن رأس لعمود أو صف أو مجموعة أعمدة أو صفوف.
selected<option>تحدد أنه يجب تحديد خيار مسبقًا عند تحميل الصفحة.
shape<area>يحدد شكل المنطقة.
size<input> – <select>يحدد العرض بالأحرف لعنصر <input> أو يحدد عدد الخيارات المرئية لعنصر <select>.
sizes<img> – <link> – <source>يحدد حجم المورد المرتبط.
span<col> – <colgroup>يحدد عدد الأعمدة لتمتد.
spellchackالسمات العامة – Global Attributesيحدد ما إذا كان العنصر سيخضع للتدقيق الإملائي والنحوي أم لا.
src<video> – <audio> – <img>
<iframe> – <script> – <embed>
<source> – <track> – <input>
يحدد عنوان URL لملف الوسائط.
srcdoc<iframe>يحدد محتوى HTML للصفحة المراد إظهارها في الـ <iframe>.
srclang<track>يحدد لغة بيانات نص المسار، وإذا كان [“kind=”subtitles] فهذه السمة مطلوبة.
srcset<img> – <source>يحدد عنوان URL للصورة لاستخدامه في مواقف مختلفة.
start<ol>يحدد قيمة البداية لقائمة مرتبة.
step<input>يحدد فترات العدد القانونية لحقل الإدخال.
styleالسمات العامة – Global Attributesيحدد نمط CSS مضمنًا inline لعنصر.
tabindexالسمات العامة – Global Attributesيحدد ترتيب الجدولة لعنصر.
target<area> – <a> – <form> – <base>يحدد الهدف الخاص بمكان فتح المستند المرتبط أو مكان إرسال النموذج.
titleالسمات العامة – Global Attributesيحدد معلومات إضافية حول عنصر.
translateالسمات العامة – Global Attributesيحدد ما إذا كان يجب ترجمة محتوى العنصر أم لا.
type<a> – <button> – <embed>
<input> – <link> – <object>
<script> – <source> – <style>
يحدد نوع العنصر.
usemap<object> – <img>يحدد الصورة كخريطة صورة من جانب العميل.
value<button> – <input> – <li>
<option> – <meter> – <progress> – <param>
يحدد قيمة العنصر.
width<canvas> – <embed> – <iframe>
<img> – <input> – <object> – <video>
يحدد عرض العنصر.
wrap<textarea>يحدد كيفية التفاف أو تغليف النص في منطقة النص عند إرساله في نموذج.

السمات المسبوقة بعلامة ❌ ليست مدعومة فى HTML5.



الإبلاغ عن خطأ

×

إذا وجد خطأ وتريد الإبلاغ عن هذا الخطأ، أو إذا كنت تريد تقديم اقتراح على شىء معين، فلا تتردد في إرسال بريد إلكتروني إلينا:

info@albashmoparmeg.com

شكرًا لك على مساعدتك لنا!

Advertisements