Karet alakú - CSS-trükkök

A caret-shapeCSS tulajdonság megváltoztatja a szerkeszthető elemek belsejében a kurzor alakját, ami azt jelzi, hogy a felhasználó gépel. Ez a CSS Basic felhasználói interfészek 4. szintű modul része, amely jelenleg Working Draft állapotban van.

Amint írok, a caret az a kis villogó sáv, amely minden általam begépelt karaktert követ.

Használhatjuk caret-shapea sáv megváltoztatására valami másra, például mondjuk egy blokkra:

.element ( caret-shape: block; )

Ez olyan karettát állít elő, amely jobban hasonlít a parancssorba történő beíráskor:

Szintaxis

caret-shape: auto | bar | block | underscore

• Kezdő érték: auto
• A következőkre vonatkozik: olyan elemek, amelyek elfogadják a bemenetet
• Örökölt: igen
• Százalékok: n / a
• Számított érték: megadott kulcsszó
• Animáció típusa: kiszámított érték szerint

Értékek

caret-shape: auto; caret-shape: bar; caret-shape: block; caret-shape: underscore;

Jelenleg nincs sok böngészőtámogatásunk caret-shape(lásd alább), de itt bemutatjuk ezeket az értékeket.

Böngésző támogatás

Úgy tűnik, hogy semmilyen adat nem áll rendelkezésre a Caniuse-ban, de néhány gyors teszteléssel itt találtam:

AZAZ	Él	Firefox	Króm	Szafari	Opera
Nem	Nem	Nem	Nem	Nem	Összes

Android Chrome	Android Firefox	Android böngésző	iOS Safari	Opera Mobile
Nem	Nem	Nem	Nem	Nem

Ezt „hamisíthatjuk”

Míg a böngésző támogatása az, mi valójában megismételhetjük a hatást más CSS varázslatokkal is.

Ez az a fajta dolog, amelyet ezen az írógép-animáción használnak:

Több információ

• CSS Basic felhasználói felület modul 4, szint (Munka tervezet)

Kapcsolódó tulajdonságok

Almanach 2021. január 27-én

hiányjel

.element ( caret: #ff7a18 underscore; ) Chris Coyier