Die Eigenschaft caret-color definiert die Farbe des Cursors für die Einfügung. Es ist eine dünne vertikale Linie, die standardmäßig schwarz ist. Diese Eigenschaft ermöglicht es, jede beliebige Farbe auf die Einfügemarke anzuwenden.
| Anfangswert | auto |
| Gilt für | Alle Elemente |
| Geerbt | Ja |
| Animierbar | Nein |
| Version | CSS3 |
| DOM Syntax | object.style.caretColor = "#1c87c9"; |
Syntax
caret-color: auto | color;Beispiel
<!DOCTYPE html>
<html>
<head>
<title>Der Titel des Dokuments</title>
<style>
.caret-example1 {
caret-color: transparent;
}
.caret-example2 {
caret-color: #1c87c9 ;
}
</style>
</head>
<body>
<h2>Ein Beispiel für die Eigenschaft caret-color</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>Werte
| Wert | Beschreibung |
|---|---|
| auto | Es stellt die aktuelle Farbe des Textes ein. Das ist der Standardwert. |
| color | Es definiert die Farbe von caret. |
| initial | Es setzt die Eigenschaft auf seinen Standardwert. |
| inherit | Es erbt die Eigenschaft von seinem übergeordneten Element. |
Browser-Support
|
|
|
|
|
|---|---|---|---|---|
| 57.0+ | ✕ | 53.0+ | 11.1+ | 44.0+ |
Übe dein Wissen
Was ist die Eigenschaft 'caret-color' in CSS?
Richtig!
Falsch!