Computer >> Máy Tính >  >> Lập trình >> CSS

Thay đổi màu con trỏ bằng màu dấu mũ CSS

Để thay đổi màu của dấu mũ chèn, CSS thuộc tính dấu mũ được sử dụng.

Ví dụ

Các ví dụ sau minh họa thuộc tính CSS caret-color.

<!DOCTYPE html>
<html>
<head>
<style>
form {
   padding: 2%;
   margin: 2%;
   text-align: center;
}
form:focus-within {
   box-shadow: 0 0 10px rgba(0,0,0,0.6);
   background-color: beige;
}
input {
   font-size: 3em;
   caret-color: chartreuse;
   margin: 2%;
}
</style>
</head>
<body>
<form>
<input value="Check the caret color!" />
<button>Hit!</button>
</form>
</body>
</html>

Đầu ra

Điều này sẽ tạo ra kết quả sau -

Thay đổi màu con trỏ bằng màu dấu mũ CSS

Ví dụ

<!DOCTYPE html>
<html>
<head>
<style>
form {
   padding: 2%;
   margin: 2%;
   background-color: thistle;
}
form:focus-within {
   box-shadow: 0 0 10px rgba(0,0,0,0.6);
}
textarea {
   caret-color: transparent;
}
</style>
</head>
<body>
<form>
<input type="radio" />1
<input type="radio" />2
<textarea placeholder="Invisible"></textarea>
</form>
</body>
</html>

Đầu ra

Điều này sẽ tạo ra kết quả sau -

Thay đổi màu con trỏ bằng màu dấu mũ CSS