开发者

How to change cursor color without changing text color?

I want to have the cursor #FFF while my font is 开发者_如何学Python#000.

Is that possible?


You can make a custom one.

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


From the mozilla docs

/* 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);


Yes it's easy. Set your font color normally then use a custom cursor.

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

That does depend on wether the custom cursor can be color, I'm just assuming it can be.


to change caret color CSS of input type text and textarea use below 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 Demo


Try this

<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>
0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜