Właściwość user-select kontroluje możliwość kopiowania tekstu i wyboru obiektu przez użytkownika. Z pomocą tej właściwości można np. zablokować możliwość kopiowania treści ze strony internetowej. Właściwość ta może okazać się przydatna kiedy nie chcemy np. by ktoś kopiował treści z naszej strony.
Co znajdziesz w tym wpisie
Przyjmowane wartości
Właściwość user-select może przyjąć wartości:
- auto – domyślna wartość, zezwala na wszystko
- none – blokuje możliwość wyboru elementu np. nie można kopiować tekstu
- text – tekst można kopiować
- all – zamienia podwójne kliknięcie w obiekt na pojedyncze (nie musimy wykonywać dwu kliku by zaznaczyć fragmęt)
Przykłady działania
See the Pen bGBVLZN by Aura (@Julka85) on CodePen.dark
Interpretacja przez przeglądarki
Właściwość | Chrome | IE / Edge | Firefox | Safari | Opera |
---|---|---|---|---|---|
user-select | 54.0 6.0 -webkit- | 10.0 -ms- | 2.0 -moz- | 3.1 -webkit- | 41.0 15.0 -webkit- |
źródła:
https://www.w3schools.com/cssref/css3_pr_user-select.asp
https://css-tricks.com/almanac/properties/u/user-select/