:read-writeIr :read-onlyselektoriai yra du Wzruszalność pseudo-klasės siekiant padaryti formą stiliaus lengviau remiantis disabled, readonlyir contenteditableHTML atributai. Nors naršyklės palaikymas nėra toks blogas, įvairūs diegimai yra gana nerealūs.
Pagal oficialias CSS specifikacijas, :read-writeparinkiklis atitiks elementą, kai:
- tai yra arba
inputkuris turi,readonlyneidisabledatributų. - tai yra
textareakuris neturireadonlyneidisabled - tai yra bet kuris kitas redaguojamas elementas (dėka
contenteditableatributo)
Sintaksė ir pavyzdys
/* Any element that is not writable */ :read-only ( ) /*… so you might want to scope it */ input:read-only, textarea:read-only, (contenteditable):read-only ( cursor: not-allowed; ) /* Any enabled text input or enabled textarea or element with the contenteditable attribute */ :read-write ( background: white; cursor: text; )Naršyklės palaikymas
Šie naršyklės palaikymo duomenys yra iš „Caniuse“, kuri turi daugiau informacijos. Skaičius rodo, kad naršyklė palaiko šios ir naujesnės versijos funkciją.
Darbalaukis
| „Chrome“ | „Firefox“ | T.Y | Briauna | „Safari“ |
|---|---|---|---|---|
| 36 | 3 * | Ne | 13 | 9 |
Mobilusis / planšetinis kompiuteris
| „Android Chrome“ | „Android Firefox“ | „Android“ | „iOS Safari“ |
|---|---|---|---|
| 88 | 85 | 81 | 9.0–9.2 |
Yra didelis skirtumas tarp rekomenduojamų specifikacijose ir to, ką iš tikrųjų veikia naršyklės. Pvz., Jei mes laikysimės specifikacijų, kiekvienas elementas, kurį galima redaguoti vartotojui, bet išjungtas ( disabledarba readonly) arba paprasčiausiai jo negalima redaguoti, turėtų būti pasirinktas be kvalifikacijos :read-only.
| „Chrome“ | „Firefox“ | „Safari“ | Opera | |
|---|---|---|---|---|
input | :skaityk rašyk | :skaityk rašyk | :skaityk rašyk | :skaityk rašyk |
input(disabled) | :skaityk rašyk | :skaityk rašyk | :skaityk rašyk | :skaityk rašyk |
input(readonly) | :Tik skaitymui | :Tik skaitymui | :Tik skaitymui | :Tik skaitymui |
(contenteditable) | - | :skaityk rašyk | - | :Tik skaitymui |
* | - | :Tik skaitymui | - | :Tik skaitymui |
Tuo tarpu atrodo, kad tai daro tik „Firefox“ ir, matyt, ne taip gerai, nes mano, kad tai yra disabledindėlis :read-write. Kalbant apie contenteditabletai :read-write, kad „ Opera“ nepažymi elemento kaip , tai tiesiog dėl to, kad jis nepalaiko contenteditable.