caret
i CSS er en forkortelse ejendom, der kombinerer caret-color
og caret-shape
egenskaber i en enkelt erklæring. Så vi skal skrive dette:
.element ( caret: #ff7a18 underscore; )
... der ligner at skrive dette:
.element ( caret-color: #ff7a18; caret-shape: underscore; )
Det er en god genvej, når du vil ændre en opbevarings farve og form. Og hvad er en opbevaring, spørger du? Du er sandsynligvis mest kendt ved at se en, når du skriver i et redigerbart element, såsom et tekstinput eller et tekstområde. Jeg skriver dette indlæg i WordPress, som stort set er et kæmpe formfelt, og dette er det tegn, jeg ser blinke mod mig:
Så ved at indstille caret-color
til, sige og #ff7a18
, caret-shape
til noget lignende underscore
, kan vi forvente at se noget som dette:
Syntaks
caret: ||
Syntaksen kan tage en eller anden værdi ... eller begge dele! Hvis en værdi er tom, bruges dens indledende værdi, som er auto
for begge bestanddele.
- Initial:
auto
- Gælder for: elementer, der accepterer input
- Arvet: ja
- Procentdele: ikke oplyst
- Beregnet værdi: se individuelle egenskaber
- Animationstype: ikke animerbar
Værdier
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;
Browsersupport
Ingen i øjeblikket. Ejendommen er oprindeligt defineret i CSS Basic User Interface Module niveau 4 specifikation, som i øjeblikket er i Editor's Draft. Det betyder, at der stadig er plads til ændringer, der skal foretages mellem nu og når det bliver en anbefaling til browsere at implementere.
I mellemtiden kan vi sortere "falske" caret
ejendommen med en anden CSS-magi.
Relaterede egenskaber
Almanak den 27. januar 2021caret-farve
.element ( caret-color: red; )
Geoff Graham