更改复选框html的指针

Question

我是html和css的新手。目前我有一个复选框。请看下面的代码：

<input type="checkbox" name="vehicle" value="Bike">I have a bike<br>

当我将鼠标悬停在复选框上时，我需要一个手形图标。我怎样才能实现这一目标？

Answer 1

您使用pointer CSS样式将默认光标更改为指针手。

首先，在您的复选框中添加ID或类。

<input id="chkBike" type="checkbox" name="vehicle" value="Bike">I have a bike<br>

在CSS中，使用以下样式。

#chkBike{
  cursor: pointer;
}

Answer 2

使用cursor:pointer你可以实现这一目标

input[type="checkbox"] {
    cursor: pointer;
}

<input type="checkbox" name="vehicle" value="Bike">I have a bike<br>

Answer 3

2
投票

input[type="checkbox"] {
    cursor: pointer;
}

Answer 4

你可以使用样式属性，如下面的代码

<input type="checkbox" name="vehicle" value="Bike" style="cursor:pointer"/>I have a bike<br>

我有一辆自行车

Answer 5

试试这个：

input
{
  cursor:pointer
  }

<input type="checkbox" name="vehicle" value="Bike">I have a bike<br

Answer 6

我想你想这样： -

label, input[type="checkbox"] {
    cursor: pointer;
}
<label><input type="checkbox" name="vehicle" value="Bike"> I have a bike</label>

Answer 7

使用CSS cursor属性，参见here参考：

 input { cursor: pointer }

Answer 8

将id设置为相应的输入

<input type="checkbox" name="vehicle" value="Bike" id="vehicleId">I have a bike<br>

并在悬停时如下所示应用样式css cursor: pointer

#vehicleId:hover{cursor:pointer};