HTML Link Types
أنواع الروابط في لغة HTML
سوف تتعلم في هذا الدرس استخدامات عنصر <a> في لغة HTML، في إنشاء كلاً من [ bookmark- download- accesskey ].
التاريخ
الدروس
المستوى
اللغة
المشاهدات
المواضيع
HTML Link Types
أنواع الروابط في لغة HTML
</>
Creating bookmark anchors in HTML
انشاء رابط كعلامة مرجعية في لغة HTML
تُستخدم الروابط في إنشاء bookmark علامات مرجعية تمكّن القراء من الذهاب مباشرة داخل صفحة الويب إلى الأقسام التي يريدونها وتجاهل بعض المواضيع غير المهمة لهم أي يتم القفز إلى أقسام محدّدة.
تتم عملية إنشاء bookmark علامات مرجعية بخطوتين، هما:
- إضافة id خاص بالقسم المراد الذهاب إليه وتخطي جميع الأقسام التي تسبقه.
- إنشاء رابط له وربطه بالقسم.
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>