الفرق بين المراجعتين لصفحة: «CSS/:visited»
< CSS
ط استبدال النص - '\[\[تصنيف:(.*)\]\]' ب'{{SUBPAGENAME}}' |
لا ملخص تعديل |
||
سطر 21: | سطر 21: | ||
شيفرة HTML: | شيفرة HTML: | ||
<syntaxhighlight lang="html"> | <syntaxhighlight lang="html"> | ||
<a href="#test-visited-link"> | <a href="#test-visited-link">هل قمت بزيارة هذا الرابط حتى الآن؟</a><br> | ||
<a href=""> | <a href="">لقد قمت بالفعل بزيارة هذا الرابط</a> | ||
</syntaxhighlight>شيفرة CSS:<syntaxhighlight lang="css"> | </syntaxhighlight>شيفرة CSS:<syntaxhighlight lang="css"> |
مراجعة 10:17، 11 أكتوبر 2018
الصنف الزائف :visited
في CSS (أي pseudo-class) يُمثِّل عنصرًا تمت زيارته من قبل، ولأسباب تابعة للخصوصية فإنَّ عدد الخاصيات التي يمكن تغيير قيمتها باستخدام هذا المُحدِّد قليلةٌ جدًا.
a:visited {
color: green;
}
الأنماط المُعرَّفة للصنف الزائف :visited
سيتم تجاوزها بأيّة أصناف زائفة تليها خاصة بالروابط (مثل :active
أو :hover
أو :link
) التي لها نفس درجة التحديد. ولتطبيق الأنماط تطبيقًا صحيحًا فضع قاعدة :visited
بعد قاعدة :link
لكن قبل بقية القواعد الخاصة بالروابط وفق الترتيب :link
ثم :visited
ثم :hover
ثم :active
.
ملاحظة: استخدم المُحدِّد :any-link
لتحديد الروابط جميعها سواءً زارها المستخدم من قبل أم لم يزرها.
لأسبابٍ تتعلق بالخصوصية، فإنَّ عدد الخاصيات التي مكن تطبيقها على هذا الصنف محدودةٌ جدًا:
- الخاصيات المسموحة هي
color
وbackground-color
وborder-color
وborder-bottom-color
وborder-left-color
وborder-right-color
وborder-top-color
وcolumn-rule-color
وoutline-color
. - خاصيات SVG المسموحة هي
fill
وstroke
. - سيتم تجاهل قناة alpha لجميع الأنماط المُطبَّقة.
- صحيحٌ أنَّ الخاصيات السابقة قد تُغيّر من مظهر الألوان للمستخدم النهائي، لكن الخاصية
window.getComputedStyle
ستكذب دومًا وستُعيد القيمة اللونية لحالات الرابط الأخرى (الحالات ما عدا الحالة :visited
)
الشكل العام لهذا المحدد:
:visited
أمثلة
شيفرة HTML:
<a href="#test-visited-link">هل قمت بزيارة هذا الرابط حتى الآن؟</a><br>
<a href="">لقد قمت بالفعل بزيارة هذا الرابط</a>
شيفرة CSS:
a {
background-color: white;
border: 1px solid white;
}
a:visited {
background-color: yellow;
border-color: hotpink;
color: hotpink;
}
دعم المتصفحات
الميزة | Chrome | Firefox | Internet Explorer | Opera | Safari |
---|---|---|---|---|---|
الدعم الأساسي | 1.0 | 1.0 | 3.0 | 3.5 | 1.0 |
جعل عدد الخاصيات محدودًا | 6.0 | 4.0 | 8.0 | ؟ | 5.0 |
مصادر ومواصفات
- معيار HTML Living Standard.
- مسودة Selectors Level 4.
- مواصفة Selectors Level 3.
- مواصفة CSS Level 2 (Revision 1)، جعلت هذه المواصفة عدد الخاصيات التي يمكن تطبيقها مع هذا المُحدِّد محدودًا.
- مواصفة CSS Level 1.