W3docs

Propiedad caret-color de CSS

The carter-color is a CSS property which specifies the color of the cursor. Find an example with this property.

La propiedad caret-color especifica el color del cursor de inserción (caret). Se trata de una línea vertical delgada, fácilmente perceptible debido a su parpadeo. Por defecto, este cursor es negro. No obstante, la propiedad caret-color permite aplicar cualquier color al cursor.

Valor inicialauto
Se aplica aElementos que aceptan entrada de texto.
HeredableNo.
AnimableNo.
VersiónCSS3
Sintaxis DOMobject.style.caretColor = "#1c87c9";

Sintaxis

Sintaxis de la propiedad caret-color de CSS

caret-color: auto | color;

Ejemplo de la propiedad caret-color:

Ejemplo de la propiedad CSS caret-color con valor transparente y color

<!DOCTYPE html>
<html>
  <head>
    <title>Title of the document</title>
    <style>
      .caret-example1 {
        caret-color: transparent;
      }
      .caret-example2 {
        caret-color: #1c87c9;
      }
    </style>
  </head>
  <body>
    <h2>Caret-color property example</h2>
    <input value="Default caret color" />
    <br />
    <br />
    <input class="caret-example1" value="Transparent caret color" />
    <br />
    <br />
    <input class="caret-example2" value="Custom caret color" />
  </body>
</html>

Valores

ValorDescripción
autoEstablece el color actual del texto. Este es el valor predeterminado.
colorEspecifica un color para el cursor.
initialHace que la propiedad utilice su valor predeterminado.
inheritHereda la propiedad de su elemento padre.

Práctica

Práctica

¿Cuál es la función de la propiedad CSS caret-color?