Home  >  Article  >  Web Front-end  >  How to hide the cursor in css input

How to hide the cursor in css input

青灯夜游
青灯夜游Original
2021-11-18 16:51:063861browse

In CSS, you can use the caret-color attribute to set the color of the cursor in the input to be transparent, thereby achieving the effect of hiding the cursor. The syntax is "input{caret-color:transparent;}".

How to hide the cursor in css input

The operating environment of this tutorial: Windows 7 system, CSS3&&HTML5 version, Dell G3 computer.

In the project, I encountered a requirement to hide the cursor of the input box, but also have the input function. How to do this?

It's actually very simple. You just need to use the caret-color attribute to set the color of the cursor in the input to transparent.

<input type="text" />

input{
	caret-color:transparent;
}

How to hide the cursor in css input

Description: The

caret-color attribute specifies the color of the cursor (caret) in inputs, textareas, or any editable element.

Syntax:

caret-color: auto|color;
  • auto: Default. Browsers use currentColor for the caret.

  • #color: Specifies the color used for the caret. All legal color values ​​can be used (rgb, hex, named colors, etc.).

(Learning video sharing: css video tutorial)

The above is the detailed content of How to hide the cursor in css input. For more information, please follow other related articles on the PHP Chinese website!

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn