HtmlCss光标(插入符caret)透明隐藏光标 221106笔记

HtmlCss光标透明隐藏光标 221106笔记

光标有两种

1. 文字插入符光标(caret), 一闪一闪的竖线
2. 鼠标光标(cursor), 或者应该叫指针, 或叫鼠标指针

这里说的是文字插入符光标(caret), 一闪一闪的竖线

caret的一种记忆方式
car >>> care >>> caret

HtmlCss光标透明隐藏光标 可以用css的 caret-color:transparent;

caret-color:transparent;
1

• caret-color 插入夫光标的颜色
• • transparent 透明
• • red 红色
• • blue 蓝色
• • black 黑色
• • purple 紫色

文字插入符光标透明

caret-color:transparent;

<section style="font-size:66px; text-shadow:3px 3px 6px black; background-color:#ddeeff; box-shadow:5px 5px 8px black; margin-bottom:30px;">
	<div>文字插入符光标透明div>
	<header><b><code style="font-size:88px; color:red;">caret-color:transparent;code>b>header>
section>

<section class=Sty010 >
<style>
	.Sty010{font-size:60px; }
	.Sty010>div{ border:1px solid black;  box-shadow:3px 3px 6px black; margin-bottom:20px; }

style>
<div>没有设置 caret-colordiv>
<div style="caret-color:transparent; "> 插入符光标透明 caret-color:transparent div>
<div style="caret-color:red; "> 插入符光标红色 caret-color:red div>
<div style="caret-color:purple; "> 插入符光标紫色 caret-color:purple div>

section>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17

text-shadow:3px 3px 6px black; background-color:#ddeeff; box-shadow:5px 5px 8px black; margin-bottom:30px;”>

文字插入符光标透明

caret-color:transparent;

没有设置 caret-color

插入符光标透明 caret-color:transparent

插入符光标红色 caret-color:red

插入符光标紫色 caret-color:purple