logo

كيفية تغيير لون الرابط في CSS؟

تُستخدم الروابط لربط صفحة واحدة بصفحات الويب الأخرى. روابط مع نفسه لون كما يصعب ملاحظة بقية النص. يتم استخدام خاصية اللون في CSS لتغيير لون الروابط.

باستخدام CSS، يمكننا تصميم الروابط بطرق مختلفة. يمكننا ضبط بعض حالات الارتباط التشعبي وهي كما يلي:

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

تجدر الإشارة إلى أنه في تعريف CSS، ج: تحوم يجب أن يأتي بعد رابط و ج: زار و أيضا ج: نشط يجب أن يأتي بعد ج: تحوم لكي تكون فعالة.

يتم إعطاء ترتيب إعلان حالات الارتباط التشعبي كما يلي:

 a:link {color: lightblue;} a:visited {color: #060235} a:hover {color: #FCFC0C} a:active {color: #C0F0FC} 

لتغيير لون الرابط، علينا استخدام لون خاصية CSS. يمكن إعطاء اسم اللون بأي تنسيق صالح، مثل اسم اللون، أو قيمة rgb()، أو قيمة HEX.

الآن، دعونا نرى كيفية تعيين لون الروابط باستخدام بعض الأمثلة.

مثال

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

 a{ color: brown; } <p> The text <b>javaTpoint.com</b> in the above line is the hyperlink. </p> 
اختبره الآن

انتاج |

عند تنفيذ البرنامج ستظهر لنا الشاشة التالية

كيفية تغيير لون الرابط في CSS

عند التمرير، سيبدو الرابط كما يلي:

كيفية تغيير لون الرابط في CSS

عندما يكون الرابط في الحالة النشطة يكون لون الرابط أحمر كما هو موضح أدناه.

كيفية تغيير لون الرابط في CSS