HTML

HTML Link Types
أنواع الروابط في لغة HTML

سوف تتعلم في هذا الدرس استخدامات عنصر <a> في لغة HTML، في إنشاء كلاً من [ bookmark- download- accesskey ].

التاريخ

14 يناير 2022

الدروس

48

المستوى

مبتدئ

اللغة

عربي

المشاهدات

1283

المواضيع

12
الشروحات chevron_left HTML Link Types chevron_left HTML

HTML Link Types
أنواع الروابط في لغة HTML

</> Creating bookmark anchors in HTML
انشاء رابط كعلامة مرجعية في لغة HTML

تُستخدم الروابط في إنشاء bookmark علامات مرجعية تمكّن القراء من الذهاب مباشرة داخل صفحة الويب إلى الأقسام التي يريدونها وتجاهل بعض المواضيع غير المهمة لهم أي يتم القفز إلى أقسام محدّدة.


تتم عملية إنشاء bookmark علامات مرجعية بخطوتين، هما:

  1. إضافة id خاص بالقسم المراد الذهاب إليه وتخطي جميع الأقسام التي تسبقه.
  2. إنشاء رابط له وربطه بالقسم.
Add an id attribute to the desired chapter

الخطوة الأولى: نضع علامة مرجعية على العنصر أو القسم المراد القفز له مباشرة، حيث يتم ذلك عن طريق إضافة الخاصية [ id attribute ] على العنصر المراد الانتقال إليه.

<p id="js">JavaScript (JS) is a lightweight, interpreted, or just-in-time compiled programming language with first-class functions. While it is most well-known as the scripting language for Web pages, many non-browser environments also use it, such as Node.js, Apache CouchDB and Adobe Acrobat. JavaScript is a prototype-based, multi-paradigm, single-threaded, dynamic language, supporting object-oriented, imperative, and declarative (e.g. functional programming) styles. Read more about JavaScript.</p>
Make a link and add it to the chapter

الخطوة الثانية: نضيف رابط ثم نضع بداخل خاصية href attribute علامة شباك hash # متبوعاً ب id القسم المراد الذهاب إليه.

<p><a href="#js">Jump to JavaScript</a></p>
ملاحظة
  • يمكن إضافة أو استخدام العلامة المرجعية لأي عنصر في صفحة HTML سواء أكان link أو عنوان أو نص أو أي عنصر آخر.
  • يمكن استخدام العلامة المرجعية لأي قسم بداخل صفحة ويب أخرى، حيث يذهب المتصفح في هذه الحالة إلى الصفحة أولاً ثم ينتقل للقسم المطلوب.
  • يمكن استخدام أكثر من علامة مرجعية لأكثر من قسم في نفس الصفحة.

</> Creating download links in HTML
إنشاء روابط تحميل في لغة HTML

يمكنك في لغة HTML إنشاء رابط يحتوي بداخله على رابط ملف بأي صيغة، مثل: pdf أو zip أو rar أو docs، وذلك من خلال إضافة رابط الملف، داخل خاصية href attribute داخل عنصر <a>.

حيث يتمكن المستخدمين من تحميل الملف مباشرة عند النقر على النص أو العنصر.

Creating download links

يمكن إضافة رابط تحميل محلي، أو من سيرفر آخر خارجي.

<a href="https://www.closetag.com/files/test.zip">Download Zip file</a>
<a href="https://www.closetag.com/files/masters.pdf">Download PDF file</a>

</> Accesskey attribute in HTML
طريقة إضافة اختصار من لوحة المفاتيح لروابط HTML

يمكننا الذهاب لأي صفحة ويب عن طريق وضع اختصار على لوحة المفاتيح لأي link رابط بدل من النقر فوق النص أو العنصر، وتسمى هذه الطريقة accesskey.

  • يتم ذلك عن طريق إضافة خاصية accesskey attribute لرابط العنصر <a>.
  • يمكنك تسمية accesskey بأي اسم حيث تنطبق عليها شروط تسمية id.
  • يمكن أن تكون تسمية accesskey بحرف كحد أدنى أو أكثر.
  • يمكن أن تكون قيمة accesskey حرف ورقم أو رقم فقط.
  • لكل متصفح اختصار على لوحة المفاتيح، نضغط على زر alt + accesskey  على متصفح كروم على نظام تشغيل ويندوز.
Browser Windows Linux Mac
Chrome [alt] + accesskey [alt] + accesskey [control] + [alt] + accesskey
Edge [alt] + accesskey N/A [control] + [alt] + accesskey
Internet Explorer [alt] + accesskey N/A N/A
Firefox [alt] + [shift] + accesskey [alt] + [shift] + accesskey [control] + [alt] + accesskey
Safari N/A N/A [control] + [alt] + accesskey
Opera 15+ [alt] + accesskey [alt] + accesskey [control] + [alt] + accesskey
accesskey attribute syntax

طريقة كتابة خاصية accesskey داخل عنصر <a> في لغة HTML.

<a accesskey="character" href="value">text</a>
accesskey attribute

طريقة إضافة اختصار من لوحة المفاتيح للروابط في لغة HTML، عن طريق إضافة خاصية accesskey attribute لرابط العنصر <a>.

<a href="https://www.closetag.com/tutorial/html/" accesskey="h">HTML tutorial</a><br>
<a href="https://www.closetag.com/tutorial/css/" accesskey="c">CSS tutorial</a>
معلومات تهمك
  • لا تنسى تقييم الدروس لكي نُحدّث المُحتوى باستمرار حتى ينال إعجابك.
  • لا تنسى مشاركة الموقع مع أصدقاءك حتى تعمّ الفائدة وتكون سبب في نفعهم.
مشاركة
0
0
0
0
عدد المشاركات
هل هذه المعلومات نالت إعجابك ؟
0
0
عدد التقييمات

لديك استفسار ؟

يسعدنا كثيرا مساعدتك في استيعاب افضل للأمور, فلا تترد مطلقا في الاتصال بنا في حال كانت لديك اية اسئله او استفسارات.