css如何改變光標顏色

小編給大家分享一下css如何改變光標顏色，相信大部分人都還不怎么了解，因此分享這篇文章給大家參考一下，希望大家閱讀完這篇文章后大有收獲，下面讓我們一起去了解一下吧！

專注于為中小企業提供成都做網站、網站建設服務,電腦端+手機端+微信端的三站合一,更高效的管理,為中小企業蘇家屯免費做網站提供優質的服務。我們立足成都，凝聚了一批互聯網行業人才，有力地推動了近1000家企業的穩健成長，幫助中小企業通過網站建設實現規模擴充和轉變。

css改變光標顏色的方法是，給光標添加caret-color屬性，并設置合適的屬性值，如【caret-color: red;】。caret-color屬性規定任何可編輯元素中的光標的顏色。

本文操作環境：windows10系統、css 3、thinkpad t480電腦。

css中提供了一個屬性caret-color ，該屬性規定 input、textareas 或任何可編輯元素中的光標（插入符號）的顏色，利用該屬性我們可以達到改變光標顏色的目的。

具體語法：

caret-color: auto|color;

屬性值：

auto 默認。瀏覽器將 currentColor 用于插入符號。
color 規定用于插入符號的顏色?？梢允褂盟泻戏ǖ念伾担╮gb、十六進制、命名顏色等）。

舉例：

<!DOCTYPE html>
<html>
<head>
<style>
.example1 {
  caret-color: red;
}

.example2 {
  caret-color: transparent;
}
</style>
</head>
<body>

<h2>caret-color 屬性</h2>

<input value="默認的 caret color"><br><br>

<input class="example1" value="自定義的 caret color"><br><br>

<input class="example2" value="透明的 caret color">

<p contenteditable class="example1">此段落可以編輯。其插入符號也有自定義顏色。</p>

</body>
</html>

運行效果：

css如何改變光標顏色