HTML Link Attributes
خصائص الروابط في لغة HTML
سوف تتعلم في هذا الدرس جميع الخصائص التي تضاف إلي عنصر <a> في لغة HTML مثل خاصية target التي تقوم بفتح الرابط في نافذة جديدة.
التاريخ
الدروس
المستوى
اللغة
المشاهدات
المواضيع
HTML Link Attributes
خصائص الروابط في لغة HTML
</>
Links style color in HTML
ألوان الروابط في لغة HTML
يوجد ثلاث أشكال افتراضية تظهر بها links الروابط في صفحة HTML وهم كالآتي:
- unvisited link الروابط التي لم تقم بزيارتها من قبل، تكون underline أسفلها خط ولونها blue أزرق.
- visited link الروابط التي قمت بزيارتها من قبل، تكون underline أسفلها خط ولونها purple بنفسجي.
- active link الروابط التي تضغط عليها بزر mouse الفأرة دون ترك الزر، تكون underline أسفلها خط ولونها red أحمر.
Links color style
في هذا المثال ستتلون الروابط التي قمت بزيارتها باللون البنفسجي، وستأخذ الروابط التي لم تقم بزيارتها من قبل اللون الأزرق. يمكن عمل تحديث للصفحة وإعادة تحميلها لمشاهدة تغيّير الألوان.
<a target="_blank" href="https://www.closetag.com/tutorial/php">Visit PHP tutorial page in closetag.com</a>
ملاحظات
- تقوم المتصفحات بتحديد الألوان، لكي تساعد مستخدمي صفحات الويب، في معرفة الفرق بين الصفحات التي قاموا بزيارتها، والصفحات التي لم يقوموا بزيارتها من قبل.
- يمكن تغيير الألوان الافتراضية، لأي لون آخر باستخدام لغة CSS حسب ما يتناسب مع style موقعك.
</>
Target attribute in HTML links
خاصية Target بداخل الروابط في لغة HTML
في الوضع الافتراضي يقوم browser المتصفح بعرض الصفحة التي تريد الذهاب إليها في current tab نفس النافذة الحالية browser للمتصفح، و attribute [ Target ] هي الخاصية المسؤولة عن تحديد مكان عرض صفحة HTML الجديدة، وذلك حسب القيمة التي نضعها بداخلها.
حيث تبدأ جميع القيم بعلامة underscore [ _ ] باستثناء قيمة واحدة.
القيم التي تكتب بداخل خاصية Target هي:
- [ “_self” ] وهي القيمة الافتراضية، فإذا لن تقم بتحديد نوع attribute [ Target ] سيقوم المتصفح بفتح link الرابط في نفس النافذة، حتى إذا لم نقم بكتابة [ “_self” ].
- [ “_blank” ] تعطي هذه القيمة أمر browser للمتصفح بفتح link الرابط في new tab نافذة جديدة.
- [ “ _top” ] سنتعرف عليها في دروس لاحقة.
- [ “ _parent” ] سنتعرف عليها في دروس لاحقة.
- [ “targetframe” ] سنتعرف عليها في دروس لاحقة.
Target without [ _self ]
سوف يفتح المتصفح الصفحة الموجودة داخل href attribute في نفس النافذة الحالية بدون خاصية [ _self ].
<a href="https://www.closetag.com">Visit CloseTag :) </a>
Target [ _self ]
سوف يفتح المتصفح الصفحة الموجودة داخل href attribute في نفس النافذة الحالية، سواء تمت كتابة خاصية Target [ _self ] أو لم تتم كتابتها.
<a href="https://www.closetag.com" target="_self">Visit CloseTag :) </a>
Target [ _blank ]
سوف يقوم المتصفح بفتح الصفحة الموجودة داخل href attribute في نافذة جديدة، وستبقى النافذة الحالية بمحتواها الحالي معروضة أيضاً.
<a href="https://www.closetag.com" target="_blank">Visit CloseTag :) </a>
ملاحظة
- يجب وضع القيم الخاصة بالخاصية [target] attribute ضمن علامات تنصيص مزدوجة[" "] أو مفردة[' '].
</>
Link title attribute in HTML
خاصية title بداخل عنصر link الرابط في لغة HTML
لإظهار معلومات أو تفاصيل إضافية عند الوقوف mouse pointer بمؤشر الفأرة قليلاً على النصوص أو العناصر التي هي من النوع hyper text أي عنصر الرابط، يمكننا استخدام خاصية title attributes.
- نقوم بإضافة معلومات نصية تظهر عند الوقوف mouse pointer بمؤشر الفأرة.
- تُكتب هذه النصوص أو المعلومات الإضافية بداخل القيمة الخاصة بـ title attribute.
- تكتب title attribute بجوار خاصية href بداخل open tag علامة البداية العنصر a.
- خاصية title attribute اختيارية يمكن تجاهلها.
title attribute
يُكتب title في open tag علامة البدء بجوار خاصية href.
<a href="https://www.closetag.com" title="Welcome To CloseTag">Make box visible on mouse move above text</a>
معلومة هامة
CLOSETAG
منصة كلوز تاج التعليمية المتخصصة في تعليم البرمجة. نسعى لتقديم تجربة تعلم فريدة من خلال معسكراتنا العملية والمنظمة والمتسلسلة كما نهدف إلى تقليص الفجوة بين النظرية والتطبيق العملي؛ لذا فإننا نركز على التعليم القائم على المشاريع والتطبيقات الحقيقية. ننقل لك سنوات من الخبرة في أقل وقت ممكن تحت إشراف مهندسين عباقرة عملوا في أكبر الشركات العربية والعالمية في مجال البرمجة. مهمتنا ليست فقط تعليم البرمجة، بل نسعى أيضًا لتزويدك بمجموعة من المهارات التي تتوافق مع احتياجات سوق العمل.
