Karet - Trik CSS

Isi kandungan

caretdalam CSS adalah harta pendek yang menggabungkan caret-colordan caret-shapesifat menjadi satu deklarasi. Oleh itu, kita dapat menulis ini:

.element ( caret: #ff7a18 underscore; )

... yang serupa dengan menulis ini:

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

Itu jalan pintas yang bagus apabila anda ingin menukar warna dan bentuk karet. Dan apa itu permaidani, anda bertanya? Anda mungkin paling biasa melihatnya ketika menaip elemen yang dapat diedit, seperti input teks atau textarea. Saya menaip catatan ini di WordPress, yang pada dasarnya adalah satu bidang bentuk raksasa, dan inilah caret yang saya lihat berkelip pada saya:

Oleh itu, dengan menetapkan caret-colorke, katakan, #ff7a18dan caret-shapesesuatu seperti underscore, kita mungkin mengharapkan untuk melihat sesuatu seperti ini:

Sintaks

caret: ||

Sintaks boleh mengambil satu nilai atau yang lain ... atau kedua-duanya! Sekiranya nilai kosong, maka nilai awalnya digunakan, iaitu autountuk kedua-dua sifat penyusunnya.

Permulaan: auto
Berlaku untuk: elemen yang menerima input
Diwarisi: ya
Peratusan: n / a
Nilai dikira: lihat sifat individu
Jenis animasi: tidak beranimasi

Nilai

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;

Sokongan penyemak imbas

Tidak ada pada masa ini. Properti ini pada mulanya ditentukan dalam spesifikasi Modul Interface Pengguna Asas Pengguna CSS Tahap 4, yang kini terdapat dalam Draf Editor. Itu bererti masih ada ruang untuk perubahan dibuat dari sekarang hingga saat ini menjadi cadangan agar pelayar dapat dilaksanakan.

Sementara itu, kami dapat "memalsukan" caretharta itu dengan beberapa keajaiban CSS lain.