Tidadigi Logo

CSS caret-color Property

Thuộc tính này đặt màu cho con trỏ trong ô nhập liệu, vùng văn bản hoặc khu vực chỉnh sửa khác.

Giá trị mặc định: auto

Cú pháp:  

caret-color: auto|color;

Giá trị thuộc tính:  

  • auto: Đây là giá trị mặc định. Nó sử dụng current-color trong trình duyệt web.
  • color: Nó được dùng để chỉ định giá trị màu dùng cho caret. Tất cả giá trị đều dùng được (rgb, hex, named-color, v.v.).

Các ví dụ dưới đây minh họa thuộc tính caret-color trong CSS: 

Ví dụ:  

HTML 
<!DOCTYPE html>
<html>

<head>
    <title>caret-color property</title>
    <style>
        body {
            text-align: center;
        }
        
        .geeks {
            caret-color: red;
        }
        
        .gfg {
            caret-color: transparent;
        }
    </style>
</head>

<body>
    <h1 style="color:green;">GeeksForGeeks</h1>
    <h1>The caret-color Property</h1>
    <input value="geeksforgeeks"><br><br>
    <input class="geeks" value="C programming">
    <br><br>
    <input class="gfg" value="Java programming">
    <p contenteditable class="geeks">
        A computer science portal for geeks
    </p>
</body>

</html>

Đầu ra: 

css-caret-color-property

Trình duyệt được hỗ trợ: Các trình duyệt hỗ trợ caret-color property được liệt kê bên dưới:  

  • Google Chrome trở lên
  • Edge trở lên
  • Mozilla trở lên
  • Opera trở lên
  • Safari trở lên

Last Updated : 21/07/2025