الانتقال إلى المحتوى الرئيسي

طرق لتغيير لون الرابط الذي تمت زيارته: دليل بسيط

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

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

или в отдельном файле CSS.

الطريقة الثانية هي استخدام الطبقة الزائفة: زار. يتم تطبيق هذه الفئة الزائفة على الروابط التي تمت زيارتها وتسمح لك بتعيين الأنماط ، بما في ذلك اللون. على سبيل المثال ، يمكنك استخدام رمز كس التالي: أ: زار { اللون: أحمر؛}.

الطريقة الثالثة هي استخدام جافا سكريبت. باستخدام لغة البرمجة هذه ، يمكنك تغيير لون الرابط الذي تمت زيارته ديناميكيا. للقيام بذلك ، استخدم أساليب كائن المستند ، مثل جيتليمنتبيد أو جيتليمنتسبيكلاسينام ، للعثور على الروابط اللازمة ، ومن ثم تغيير نمطها.خاصية اللون.

  1. الغرض من هذه المادة وأهميتها
  2. طرق لتغيير لون الرابط الذي تمت زيارته
  3. استخدام كس لتغيير لون الارتباط
  4. استخدام جافا سكريبت لتغيير لون الارتباط
  5. الرابط الذي تمت زيارته
  6. كيفية التعرف على رابط تمت زيارته على صفحة ويب
  7. طرق لتحقيق
  8. استخدم الفئة الزائفة: تمت زيارتها
  9. باستخدام نمط عنصر النمط
  10. سؤال وجواب
  11. كيف يمكنني تغيير لون وصلة زار?
  12. هل يمكنني استخدام لون آخر غير الأحمر للروابط التي تمت زيارتها?
  13. كيف يمكنني تغيير لون فقط لارتباط معين?
  14. أحتاج إلى تغيير لون الرابط الذي تمت زيارته على صفحات مختلفة من موقعي. كيف نفعل ذلك?

الغرض من هذه المادة وأهميتها

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

عادة ما تغير الروابط التي تمت زيارتها لونها بحيث يمكن للمستخدم بسهولة تحديد الصفحات التي زارها بالفعل. هذا يسمح له بالتنقل بسهولة في الموقع وعدم الوصول إلى نفس الصفحات عدة مرات.

ستنظر المقالة في طرق مختلفة لتغيير لون الروابط التي تمت زيارتها ، بما في ذلك استخدام كس العادية ، باستخدام الفئة الزائفة ":زار" وجافا سكريبت. سيساعد تحليل هذه الأساليب القارئ على اختيار الأنسب لاحتياجاته وخصائص المشروع.

طرق لتغيير لون الرابط الذي تمت زيارته

الهدف: تغيير لون الرابط الذي تمت زيارته لإنشاء نمط فريد من صفحة الويب.

  1. اللون: أحمر;
  2. سمة النمط

    إلى العلامة 

  3. استخدم شفرة جافا سكريبت التالية لتغيير لون الرابط الذي تمت زيارته:

العرض: 100%;

الارتفاع: 2 بكسل;

لون الخلفية: أصفر;

}

اختر إحدى الطرق المدرجة حسب احتياجاتك وتفضيلاتك. حظا سعيدا في تغيير لون الرابط الذي تمت زيارته!

استخدام كس لتغيير لون الارتباط

هناك عدة طرق لتغيير لون الارتباط ، ولكن أبسط والأكثر شعبية منهم يستخدم كس.

. على سبيل المثال ، لتعيين لون الارتباط إلى اللون الأزرق ، يمكنك استخدام قاعدة كس التالية:

ج: رابط {

اللون: أزرق;

}

. على سبيل المثال ، لتعيين لون ارتباط تمت زيارته إلى اللون الأحمر ، يمكنك استخدام قاعدة كس التالية:

ج: زار {

اللون: أحمر;

}

ج: تحوم {

اللون: أخضر;

}

ج: يتم استخدام المحدد النشط لتغيير لون الارتباط النشط الذي نقر عليه المستخدم أو نقر عليه

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

ج: نشط {

اللون: أصفر;

}

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

  1. أو

.

استخدام جافا سكريبت لتغيير لون الارتباط

عندما نريد إضافة تغيير لون ديناميكي إلى رابط عند زيارته ، يمكننا استخدام جافا سكريبت. باستخدام جافا سكريبت ، يمكننا اكتشاف وقت زيارة الرابط ثم تغيير لونه.

بادئ ذي بدء ، يمكننا إضافة سمة أونلواد إلى العلامة لاستدعاء الدالة عند تحميل الصفحة:

بعد ذلك ، نقوم بإنشاء وظيفة تغيير اللون () داخل العلامة ، حيث سنقوم بتغيير لون الروابط:

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

الآن ، عند تحميل الصفحة ، سيتم استدعاء وظيفة التغيير() وتغيير لون الروابط التي تمت زيارتها إلى اللون الأحمر.

الرابط الذي تمت زيارته

عندما يزور المستخدم رابطا على صفحة ويب ، يحفظ متصفح الويب معلومات حول الروابط التي تمت زيارتها ويغير لونها بحيث يمكن للمستخدم تمييز الروابط التي تمت زيارتها بالفعل عن الروابط التي لم تتم زيارتها. وبالتالي ، عادة ما يكون للرابط الذي تمت زيارته لون مختلف عن اللون غير المرغوب فيه.

يمكن تكوين تغيير لون الارتباط الذي تمت زيارته باستخدام خصائص كس. للقيام بذلك ، يمكنك استخدام الخصائص التالية:

اللون: يحدد لون نص الرابط.

زخرفة النص: يحدد نمط الزخرفة لنص الارتباط ، بما في ذلك الشرطات السفلية.

في ما يلي مثال على رمز كس الذي يغير لون الرابط الذي تمت زيارته:

  1. زخرفة النص: تسطير ؛ / * يضيف تسطير سفلي إلى الرابط الذي تمت زيارته */
  2. باستخدام خصائص كس البسيطة هذه ، يمكنك بسهولة تغيير مظهر الروابط التي تمت زيارتها على صفحة الويب الخاصة بك ومساعدة المستخدمين على التنقل في موقعك بشكل أفضل.
  3. كيفية التعرف على رابط تمت زيارته على صفحة ويب

في صفحة الويب ، عادة ما يتم عرض الروابط باللون الأزرق لجعلها تبرز عن بقية النص. ومع ذلك ، بعد زيارة الرابط ، يمكن تغيير اللون بحيث يعرف المستخدم أنه قد تم فتحه بالفعل.

هناك عدة طرق لتحديد الرابط الذي تمت زيارته على صفحة الويب:

باستخدام أنماط كس. الطريقة الأكثر شعبية. يمكنك تعيين ألوان مختلفة للروابط قبل وبعد زيارتها. المغلق

    • ج: زار
  1. زار
    • باستخدام البرامج النصية جافا سكريبت. لتحديد الروابط التي تمت زيارتها ، يمكنك استخدام نصوص جافا سكريبت التي ستتتبع إجراءات المستخدم وتغيير لون الروابط. هذه الطريقة أكثر تعقيدا وتتطلب معرفة البرمجة.
  2. اختر الطريقة المناسبة لمشروعك ، اعتمادا على احتياجاتك والنظام الأساسي الذي تعمل عليه.
  3. طرق لتحقيقلتحقيق تغيير في لون الرابط الذي تمت زيارته ، يمكن لمطور الويب استخدام طرق مختلفة:
    باستخدام فئة زائفة ج: زار { اللون: أحمر؛}
    • لضبط اللون. على سبيل المثال:

الرابط

- سيتم تعيين اللون الأخضر للارتباط;

استخدام جافا سكريبت لإضافة فئة إلى رابط تمت زيارته وتغيير أسلوبه. على سبيل المثال ، باستخدام مسج:

أتش تي أم أل

جافا سكريبت

الرابط

link ( ". رابط").على ("انقر" ، وظيفة () {

this (هذا).أدكلاس ("زار");

});

.زار { اللون: أزرق؛}

- سوف تضيف فئة

زار

الرابط الذي تمت زيارته وسيغير لونه إلى اللون الأزرق;

يعتمد اختيار طريقة معينة على المتطلبات والمهام التي تواجه مطور الويب.

استخدم الفئة الزائفة: تمت زيارتها

تتمثل إحدى طرق تغيير لون الروابط التي تمت زيارتها في استخدام الفئة الزائفة: تمت زيارتها.

الفئة الزائفة: التي تمت زيارتها تنطبق على الروابط التي تمت زيارتها بالفعل من قبل المستخدم. يتيح لك ذلك تغيير لون النص أو الخلفية أو حد الرابط بعد زيارته.

مثال على استخدام فئة زائفة: تمت زيارتها:

ج: زار {

اللون: بنفسجي;

لون الخلفية: أصفر;

الحدود: 1 بكسل أسود صلب;

}

في هذا المثال ، سيتم تلوين نص الرابط باللون الأرجواني ، وستكون الخلفية صفراء ، وستكون الحدود سوداء.

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

وبالتالي ، فإن الأنماط التي يمكن تطبيقها على الروابط مع الفئة الزائفة :تقتصر الزيارة فقط على تغيير اللون والخلفية.

على سبيل المثال ، لن تتمكن من تغيير الخط أو تطبيق تأثيرات الحركة أو أنماط معينة على الروابط التي تمت زيارتها فقط.

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

باستخدام نمط عنصر النمط

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

مثال على استخدام نمط عنصر النمط لتغيير لون الارتباط الذي تمت زيارته: