Daszek - CSS-Tricks

Spisie treści

caretw CSS to skrócona właściwość, która łączy właściwości caret-colori caret-shapew jedną deklarację. Więc napiszemy to:

.element ( caret: #ff7a18 underscore; )

… Co jest podobne do pisania tego:

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

To fajny skrót, gdy chcesz zmienić kolor i kształt daszka. A co to za karetka, pytasz? Prawdopodobnie najbardziej znasz go podczas pisania w edytowalnym elemencie, takim jak pole tekstowe lub obszar tekstowy. Piszę ten post w WordPressie, który jest w zasadzie jednym ogromnym polem formularza, a to jest daszek, który widzę, mrugający na mnie:

Tak więc, ustawiając caret-colorto, powiedzmy, #ff7a18i na caret-shapecoś podobnego underscore, możemy spodziewać się czegoś takiego:

Składnia

caret: || 

Składnia może przyjąć jedną lub drugą wartość… lub obie! Jeśli wartość jest pusta, używana jest jej wartość początkowa, która dotyczy autoobu właściwości składowych.

  • Inicjał: auto
  • Dotyczy: elementów, które akceptują dane wejściowe
  • Odziedziczone: tak
  • Procenty: nie dotyczy
  • Wartość obliczona: zobacz poszczególne właściwości
  • Typ animacji: bez animacji

Wartości

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;

Wsparcie przeglądarki

W tej chwili brak. Właściwość jest początkowo zdefiniowana w specyfikacji modułu CSS Basic User Interface Module Level 4, która obecnie znajduje się w wersji roboczej redakcji. Oznacza to, że wciąż jest miejsce na wprowadzenie zmian od teraz do momentu, gdy będzie to zalecenie dla przeglądarek do wdrożenia.

W międzyczasie możemy posortować „fałszywą” caretwłaściwość za pomocą innej magii CSS.

Powiązane właściwości

Almanach z 27 stycznia 2021 r

kolor daszka

.element ( caret-color: red; ) Geoff Graham

Interesujące artykuły...