如何在不改变文本颜色的情况下更改光标颜色？

Question

我想让我的鼠标光标为#FFF，而我的字体颜色为#000。这是否可能？

- AndrewFerrara

---

光标通常是白色的。你确定你指的是“光标”吗？ - Devin Burke

你是指文本框内的插入符号（caret）吗？ - Karl Nicoll

Answer 1

你可以制作自定义鼠标指针。

input, textarea {
    cursor: url(cursor.cur);
}

- alex

Answer 2

来自mozilla 文档

/* Keyword values */
caret-color: auto;
caret-color: transparent;
caret-color: currentColor;

/* <color> values */
caret-color: red;
caret-color: #5729e9;
caret-color: rgb(0, 200, 0);
caret-color: hsla(228, 4%, 24%, 0.8);

- Matthew Harrison

Answer 3

是的，这很容易。先设置您的字体颜色，然后使用自定义光标。

http://beradrian.wordpress.com/2008/01/08/cross-browser-custom-css-cursors/

这取决于自定义光标是否可以有颜色，我只是假设它可以。

- SpliFF

Answer 4

要更改文本输入框和文本域的光标颜色CSS, 可以使用以下CSS：

input,textarea {
     color: #8f0407;
     text-shadow: 0px 0px 0px #000 ;
     -webkit-text-fill-color: transparent ;
}

input::-webkit-input-placeholder,
     textarea::-webkit-input-placeholder {
     color: #ccc;
     text-shadow: none;
     -webkit-text-fill-color: initial;
}

Codepen演示

- Dev Bhaskar

---

答案很好。在Chrome中运作良好。但是在Internet Explorer中无法正常工作。 - Jay Ponkia

Answer 5

尝试这个。

<style>
input {
  color: rgb(60, 0, 248);  /* change [input cursor color] by this*/
  text-shadow: 0px 0px 0px #D60B0B; /* change [input font] by this*/
  -webkit-text-fill-color: transparent;
}
</style>

- Balvant Ahir