كيفية ربط صورة على موقع الويب الخاص بك

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

إدراج الصور في عناصر الربط

الاستخدام الشائع للارتباط المستند إلى الصور هو رسم شعار الموقع ، والذي يتم ربطه مرة أخرى بالصفحة الرئيسية للموقع.

إليك كيفية وضع صورة غير قابلة للنقر في مستند HTML:

شعار شركتنا

لتحويل الصورة إلى رابط ، أضف رابط الارتساء ، وافتح عنصر الارتساء قبل الصورة وأغلق المرساة بعد الصورة. تشبه هذه التقنية طريقة ربط النص ، باستثناء أنه بدلاً من التفاف الكلمات ، يمكنك التفاف الصورة:

شعار شركتنا

عند إضافة هذا النوع من HTML إلى صفحتك ، لا تضع أي مسافات بين علامة الارتساء وعلامة الصورة. إذا قمت بذلك ، ستضيف بعض المتصفحات علامات صغيرة بجانب الصورة ، والتي ستبدو غريبة.

يعمل الشعار الآن أيضًا كزر للصفحة الرئيسية ، وهو إلى حد كبير معيار ويب هذه الأيام.

لاحظ أننا لا نقوم بتضمين أي أنماط مرئية ، مثل عرض الصورة وارتفاعها ، في ترميز HTML الخاص بنا. سنترك هذه الأنماط المرئية لـ CSS ونحافظ على فصل نظيف بين بنية HTML وأنماط CSS.

instagram viewer

instagram story viewer