Caret - CSS-gudrybės | CSS almanachas 2025

caretCSS yra sutrumpinta savybė, sujungianti caret-colorir caret-shapeypatybes į vieną deklaraciją. Taigi, mes turime tai parašyti:

.element ( caret: #ff7a18 underscore; )

... panašus į tai rašant:

.element ( caret-color: #ff7a18; caret-shape: underscore; )

Tai puikus klavišas, kai norite pakeisti kilimėlio spalvą ir formą. O kas yra „caret“, klausiate jūs? Tikriausiai esate labiausiai susipažinęs su tuo, kai įvedate redaguojamą elementą, pvz., Teksto įvestį ar teksto sritį. Rašau šį įrašą „WordPress“, kuris iš esmės yra vienas milžiniškos formos laukas, ir tai yra tas brėžinys, kurį matau mirksi man:

Taigi, nustatydami caret-color, tarkime, #ff7a18ir caret-shapeį kažką panašaus underscore, galime tikėtis pamatyti kažką panašaus:

Sintaksė

caret: ||

Sintaksė gali turėti vieną ar kitą reikšmę ... arba abi! Jei reikšmė yra tuščia, naudojama pradinė jos vertė, autoskirta abiem sudedamosioms savybėms.

Pradinis: auto
Taikoma elementams, kurie priima įvestį
Paveldima: taip
Procentai: nėra
Apskaičiuota vertė: žr. Atskiras savybes
Animacijos tipas: nėra animacinis

Vertybės

caret: #ff7a18 underscore; caret: yellow block; caret: hsla(50, 100%, 50%, 0.75) bar; /* Keyword color values */ caret: auto; caret: transparent block; caret: currentcolor underscore; /* Global values */ caret: inherit; caret: initial; caret: unset;

Naršyklės palaikymas

Šiuo metu nėra. Iš pradžių ši ypatybė apibrėžta CSS pagrindinės vartotojo sąsajos modulio 4 lygio specifikacijoje, kuri šiuo metu yra redaktoriaus juodraštyje. Tai reiškia, kad vis dar yra galimybių atlikti pakeitimus nuo tada, kai tai tampa rekomendacija naršyklėms įgyvendinti.

Tuo tarpu mes galime „suklastoti“ caretturtą su kita CSS magija.