Uporabnik-izberi - CSS-triki | Almanah CSS 2025

user-selectHotel v CSS nadzoruje, kako je besedilo v elementu dovoljeno izbrana. Na primer, z njim lahko besedilo ne morete izbrati.

.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 */ )

To je uporabno v situacijah, ko želite uporabnikom omogočiti enostavnejšo / čistejšo izkušnjo kopiranja in lepljenja (ne da bi jim slučajno izbrali besedilo neuporabne stvari, kot so ikone ali slike). Vendar je malo hrošč. Firefox uveljavlja dejstvo, da besedila, ki se ujema s tem izbirnikom, ni mogoče kopirati. WebKit še vedno omogoča kopiranje besedila, če izberete elemente okoli njega.

To lahko uporabite tudi za uveljavitev izbire celotnega elementa:

.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 */ )

Tu je nekaj predstavitev teh:

Oglejte si predstavitev uporabnika Pen Pen Chris Coyier (@chriscoyier) na CodePen.

Za to lastnost že nekaj časa ni bilo specifikacij, zdaj pa je zajet v modulu CSS Basic User Interface Level 4.

Privzeta vrednost je auto, zaradi česar se izbira izvaja normalno, kot pričakujete. "Običajno" je nekoliko zapleteno. Tu je vredno citirati specifikacijo:

Na psevdoelementih :: before in :: after je izračunana vrednost none

Če je element element, ki ga je mogoče urejati , je izračunana vrednostcontain

V nasprotnem primeru, če je izračunana vrednost user-select v nadrejenem elementu tega elementa all, je izračunana vrednostall

V nasprotnem primeru, če je izračunana vrednost user-select v nadrejenem elementu tega elementa none, je izračunana vrednostnone

V nasprotnem primeru je izračunana vrednost text

Z drugimi besedami, inteligentno se kaskadira in ponastavi na čutno stanje. Zdi se, da bi morda s to funkcijo lahko izbrali psevdoelemente, vendar še ni zadnje besede.

Starejša / lastniška

Firefox podpira -moz-none, kar je enako kot nobena, razen da pomeni, da lahko podelementi preglasijo kaskado in postanejo znova izbirni. -moz-user-select: text;Od Firefoxa 21 se noben ne obnaša kot -moz-none.

Internet Explorer podpira tudi do zdaj lastniško vrednost, elementpri kateri lahko izberete besedilo znotraj elementa, vendar se bo izbor ustavil na mejah tega elementa.

Več informacij

Dokumenti MDN
Uporabniška interoperabilnost

Podpora za brskalnik

To je posebej za -*-user-select: none;

Ti podatki o podpori brskalnika so od Caniuse, ki vsebuje več podrobnosti. Številka pomeni, da brskalnik podpira to funkcijo v tej različici ali novejši.