CSS Links
الروابط في لغة CSS
سوف تتعلم في هذا الدرس التحكم في شكل الروابط عن طريق لغة CSS من حيث الألوان والحجم والخلفيات والتحكم في الروابط مع تمرير مؤشر mouse الفأرة علي الرابط.
التاريخ
الدروس
المستوى
اللغة
المشاهدات
المواضيع
CSS Links
الروابط في لغة CSS
</>
CSS Link selectors
تحديد حالات الروابط في لغة CSS
عن طريق link selectors في لغة CSS تستطيع التحكم في الروابط التي قمت بزيارتها مسبقاً ويقوم المتصفح بتغيير لونها باللون المميز والمختلف ويظهر هذا اللون مع ضغط أو تمرير زر mouse الفأرة.
للروابط 4 حالات في لغة CSS:
- a:visited للتحكم في شكل الرابط الزي قمت بزيارته وهو أن يصبح بلوم نختلف بعد زيارتة أو شكل مختلف.
- a:link للتحكم في الرابط الافتراضي الزي يظهر على المتصفح قبل زيارتة والأفتراضي لون الأزرق ويمكن تغييرة.
- a:hover للتحكم في شكل الرابط الزي يتم تمرير مؤشر mouse أعلي الرابط فسوف يظهر بشكل مختلف ويرجع الشكل للأفتراضي عند إبعاد مؤشر زر mouse مرة أخري.
- a:active للتحكم في شكل الرابط الزي يتم click النقر علية بزر الماوس في هذه اللحظة فقط عند الضغط سوف يتغير الشكل إيضا أو اللون.
CSS link styles with mouse engagement
تغيير شكل الرابط مع إحتكاك mouse الفأره في لغة CSS.
a:hover
{
color: pink;
}
</>
CSS link Decoration
ديكور الروابط في لغة CSS
CSS link Decoration
التحكم في مكان الخطوط العرضية أسفل نصوص الروابط في لغة CSS.
a:hover {
text-decoration: underline;
}
</>
CSS Background Color
التحكم في خلفيات الروابط في لغة CSS
يمكن التحكم في خلفية الرابط التي تظهر بشكل إفتراضي ويمكن تغيير لون الخلفية في حالات معينة وهي عند الضغط والروابط التي تمت زيارتها في لغة CSS.
CSS Background Color
التحكم في خلفية ارابط في لغة CSS.
a:hover {
background-color: lightgreen;
}
</>
CSS Link Buttons
روابط علي شكل زر في لغة CSS
عن طريق لغة CSS تستطيع التحكم في أشكال links الروابط وتحويلها من رابط نصي إلي شكل Buttons زر عن طريق إضافة لها مجموعة خصائص.
CSS link display inline
عرض الروابط بشكل صندوق لنتحكم في الهوامش وحجمها في لغة CSS.
CSS remove text underline
إزالة الخط السفلي أسفل النصوص من الروابط في لغة CSS
</>
CSS link hover
تغيير شكل الرابط عند تمرير زر mouse في لغة CSS
</>
CSS link cursor
مؤشر mouse الفأرة في لغة CSS
في لغة CSS يمكن تغيير شكل مؤشر mouse الفأرة عند تمرير المؤشر أعلي الرابط ويوجد عدة اشكال يمكن اختيار اي نوع منهم.
<span style="cursor: ne-resize">ne-resize</span><br> <span style="cursor: nw-resize">nw-resize</span><br> <span style="cursor: pointer">pointer</span><br>
روابط
نمط أو شكل
فأرة المستخدم
حجم الخط
عائلة الخط
لون
خلفية
بناء الجملة
محددات
تزيين أو زخرفة
خاصية
زر
خصائص
مؤشر
Cascading Style Sheets
صفحات الأنماط الانسيابية
CLOSETAG
منصة كلوز تاج التعليمية المتخصصة في تعليم البرمجة. نسعى لتقديم تجربة تعلم فريدة من خلال معسكراتنا العملية والمنظمة والمتسلسلة كما نهدف إلى تقليص الفجوة بين النظرية والتطبيق العملي؛ لذا فإننا نركز على التعليم القائم على المشاريع والتطبيقات الحقيقية. ننقل لك سنوات من الخبرة في أقل وقت ممكن تحت إشراف مهندسين عباقرة عملوا في أكبر الشركات العربية والعالمية في مجال البرمجة. مهمتنا ليست فقط تعليم البرمجة، بل نسعى أيضًا لتزويدك بمجموعة من المهارات التي تتوافق مع احتياجات سوق العمل.
