css如何修改光标颜色-木庄网络博客

css如何修改光标颜色

2022-02-08 06:10:10 PHP中文网 JavaScript 百度已收录

本文摘自PHP中文网，作者青灯夜游，侵删。

方法：1、利用caret-color属性，语法“caret-color:颜色值;”；2、利用“::first-line”选择器，语法“input{color:光标颜色值;}input::first-line{color:文本颜色值;}”。

本教程操作环境：windows7系统、CSS3&&HTML5版、Dell G3电脑。

CSS改变插入光标颜色常用两种方法：

方法1：使用caret-color属性

caret-color 属性规定 input、textareas 或任何可编辑元素中的光标（插入符号）的颜色。

示例：

<!DOCTYPE html>
<html>
    <head>
        <style type="text/css">
            .example {
              caret-color: red;
            }
        </style>
    </head>
 
    <body>
        <input value="默认的光标颜色"><br><br>
        <input class="example" value="自定义光标颜色"><br><br>
 
    </body>
 
</html>