CSS (hojas de estilo en cascada) es un lenguaje de hojas de estilo utilizado para diseñar una página web para que sea atractiva. La razón para usar esto es simplificar el proceso de hacer que las páginas web estén presentables. Te permite aplicar estilos en las páginas web. Más importante aún, le permite hacer esto independientemente del HTML que conforma cada página web.
En este artículo, vamos a aprender qué es el estilo de intercalación de entrada de texto.
El cursor de inserción , el marcador visible donde se insertará el siguiente carácter escrito y también se conoce como el cursor de entrada de texto. Aparece solo cuando desea ingresar algún texto en el editor. En HTML se usa con el elemento de entrada. Es una delgada línea vertical que parpadea para que sea más notoria. Por defecto es negro, pero se puede alterar su color con esta propiedad.
Sintaxis:
caret-color: auto|color;
Valores de propiedad:
- auto(predeterminado): Tiene un valor predeterminado. Utiliza el color actual en el navegador web.
- color: se utiliza para especificar el valor de color utilizado para el signo de intercalación. Se pueden usar todos los valores (rgb, hexadecimal, color con nombre, etc.).
Ejemplo: En el siguiente ejemplo, tenemos dos cuadros de entrada. En el cuadro superior, el color del símbolo de intercalación es negro, pero el cuadro de entrada inferior tiene un símbolo de intercalación de color rojo.
HTML
<!DOCTYPE html>
<html>
<head>
<title>CSS filter property</title>
<style>
body{
text-align:center;
background-color:lightgrey;
}
img {
filter: brightness(30%);
margin-top:60px;
width:80%;
}
input {
caret-color: auto;
display: block;
margin-bottom: .5em;
}
input.custom {
caret-color: red;
}
p.custom {
caret-color: green;
}
</style>
</head>
<body>
<h1 style="color:green;">GeeksforGeeks</h1>
<div>
<input value="click here"
size="84"/>
<br><br>
<input class="custom"
value="click here"
size="84"/>
<p contenteditable class="custom">
</p>
</div>
</body>
</html>
GIF de salida:
Publicación traducida automáticamente
Artículo escrito por krishna_97 y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA