Усер-селецт - ЦСС-трикови

user-selectИмовина у ЦСС контролише како је текст у елементу је дозвољено да буду изабрани. На пример, помоћу њега се текст не може бирати.

.row-of-icons ( -webkit-user-select: none; /* Chrome all / Safari all */ -moz-user-select: none; /* Firefox all */ -ms-user-select: none; /* IE 10+ */ user-select: none; /* Likely future */ )

Ово је корисно у ситуацијама када желите да корисницима пружите лакше / чистије искуство копирања и лепљења (да им се случајно не одаберу бескорисне ствари, попут икона или слика). Међутим, мало је грешка. Фирефок намеће чињеницу да било који текст који се подудара са тим бирачем не може бити копиран. ВебКит и даље омогућава копирање текста ако одаберете елементе око њега.

Ово такође можете користити да примените да читав елемент добије избор:

.force-select ( -webkit-user-select: all; /* Chrome 49+ */ -moz-user-select: all; /* Firefox 43+ */ -ms-user-select: all; /* No support yet */ user-select: all; /* Likely future */ )

Ево неколико демонстрација тих:

Погледајте демонстрацију корисника Пен оловке Цхриса Цоииера (@цхрисцоииер) на ЦодеПен-у.

Дуго времена није било спецификација за ово својство, али сада је обухваћено модулом ЦСС Басиц Усер Интерфаце Левел 4.

Подразумевана вредност је auto, што чини да се избор одвија нормално како очекујете. „Нормално“ је мало компликовано. Овде вреди цитирати спецификацију:

На псеудо елементима :: бефоре и :: афтер израчуната вредност је none

Ако је елемент елемент који се може уређивати , израчуната вредност јеcontain

У супротном, ако је израчуната вредност усер-селецт на родитељу овог елемента all, израчуната вредност јеall

У супротном, ако је израчуната вредност усер-селецт на родитељу овог елемента none, израчуната вредност јеnone

У супротном, израчуната вредност је text

Другим речима, интелигентно се спушта и враћа у чулно стање. Изгледа да би се можда ова функција могла користити за стварање псеудо елемената који се могу изабрати, али још нема коначну реч.

Старији / власнички

Фирефок подржава -moz-none, што је баш као нико, осим што значи да под-елементи могу надјачати каскаду и поново постати изабрани са -moz-user-select: text;Фирефок-ом 21, нико се не понаша као -moz-none.

Интернет Екплорер такође подржава досад власничку вредност elementу којој можете одабрати текст унутар елемента, али избор ће се зауставити на границама тог елемента.

Више информација

МДН Документи
Корисничка интероперабилност

Подршка прегледача

Ово је посебно за -*-user-select: none;

Подаци о подршци за прегледач су од компаније Цаниусе, која садржи више детаља. Број указује на то да прегледач подржава функцију у тој верзији и новијој.