HTML

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

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

التاريخ

14 يناير 2022

الدروس

48

المستوى

مبتدئ

اللغة

عربي

المشاهدات

1718

المواضيع

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 أو عنوان أو نص أو أي عنصر آخر.

  • يمكن استخدام العلامة المرجعية لأي قسم بداخل صفحة ويب أخرى، حيث يذهب المتصفح في هذه الحالة إلى الصفحة أولاً ثم ينتقل للقسم المطلوب.

  • يمكن استخدام أكثر من علامة مرجعية لأكثر من قسم في نفس الصفحة.

</> 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>
توضيح هام
الزر [accesskey] في HTML ليس مفتاحًا فعليًا على لوحة المفاتيح، وإنما هو اختصار برمجي يسمح بالوصول السريع إلى عناصر محددة في صفحة الويب باستخدام تركيبات مفاتيح تختلف حسب المتصفح ونظام التشغيل. على سبيل المثال، إذا تم تحديد الحرف "H" كمفتاح وصول، يُستخدم `Alt + H` في متصفح Chrome على نظام Windows، و`Alt + Shift + H` في Firefox على نفس النظام، بينما في Safari على macOS تُستخدم تركيبة `Control + Option + H`. تختلف هذه التركيبات حسب إعدادات المتصفح والنظام.
معلومات تهمك
  • لا تنس تقييم الدروس لكي نُحدّث المُحتوى باستمرار حتى ينال إعجابك.
  • لا تنس مشاركة الموقع مع أصدقائك حتى تعمّ الفائدة وتكون سببًا في نفعهم.
مشاركة
0
0
0
0
عدد المشاركات
هل هذه المعلومات نالت إعجابك ؟
0
0
عدد التقييمات