Възможно ли е да коригирате свойствата на псевдоелемента :selection в Инструменти за програмисти?
Бих искал да мога да тествам различни цветове на фона и шрифта за селекции, без да променям изходния CSS файл, но не мога да намеря псевдоелемента никъде, когато проверявам страницата.
Можете да постигнете това в Internet Explorer и Firefox, като щракнете с десния бутон върху панела Стилове и изберете Ново правило.
::selection правило и добавете свойства
Chrome има малка икона в панела Стилове, върху която можете да щракнете, за да създадете ново правило.
::selection правило и добавете свойства
::selection в листа със стилове.
- person Jesse Schoff; 13.12.2014
p::selection, или задайте !important след стойността за целите на тестването.
- person Sampson; 13.12.2014
!important ще работи добре в този случай.
- person Jesse Schoff; 13.12.2014
Псевдоелементът ::selection е наличен в инструментите за разработка на Chrome като последен стил в панела със стилове - почти сякаш е най-малко специфичният стил. За да го видите, уверете се, че сте го дефинирали във вашия лист със стилове, след това изберете текст и проверете една от избраните думи/области.
Както беше споменато от @Sampson, можете също да добавите ::selection стилове, като използвате само ::selection или по-специфичен селектор, като p::selection или span::selection. Имайте предвид обаче, че според спецификацията можете да повлияете само на color, background-color, cursor, outline, text-decoration, text-emphasis-color и text-shadow с псевдо елемента ::selection.
Друго съображение при използването на псевдо ::selection е, че може да повлияете на достъпността, като създадете селекции, които нямат контраст. Вие също може да повлияете на видимостта на връзките. В такива случаи можете да тествате своя контраст с помощта на инструмент за изследване на контраста и можете да създадете по-конкретни ::selection стилове за връзки - нещо като:
span::selection {
background-color: #b3d8fd;
}
a.footnote span::selection {
color: #920000;
}