99 votes

Classe CSS pour le curseur du pointeur

Existe-t-il une classe ou un attribut CSS pour pointer:cursor en Bootstrap 4 spécialement pour le bouton ou le lien ?

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/css/bootstrap.min.css" rel="stylesheet"/>
<button type="button" class="btn btn-success">Sample Button</button>

8voto

Rick Points 145

Je n'ai pas assez de réputation pour commenter les réponses pertinentes, mais pour les personnes qui lisent ceci, l'ajout de .btn n'ajoute pas seulement le curseur du pointeur mais ajoute aussi beaucoup d'autres styles également. Ce qui est très bien si c'est un bouton et que vous voulez le style du bouton de démarrage, mais dans d'autres cas, cela gâcherait beaucoup de choses pour les autres éléments.

La meilleure chose que vous puissiez faire, comme Hari Das l'a suggéré et que je fais aussi toujours, est d'ajouter le css suivant :

.cursor-pointer {
  cursor: pointer;
}

Après quoi, vous pouvez l'ajouter à n'importe quel élément

<div class="cursor-pointer"> .. </div>

0 votes

Bootstrap 4.3 a déjà corrigé ce problème getbootstrap.com/docs/4.3/components/buttons/#examples

4voto

Coder Amogh Points 32

J'ai essayé et découvert que si vous ajoutez une classe appelée btn vous pouvez l'obtenir hand o cursor si vous passez la souris sur cet élément. Essayez et voyez.

Exemple :

<span class="btn">Hovering over must have mouse cursor set to hand or pointer!</span>

A la vôtre !

2voto

Bootstrap 3 - Il suffit d'ajouter le " btn " Le cours a fonctionné pour moi.

Sans curseur du pointeur :

<span class="label label-success">text</span>

Avec curseur du pointeur :

<span class="label label-success btn">text</span>

1voto

Davut Gürbüz Points 1609

Je ne sais pas quand il a été ajouté mais selon sa doc, il y a btn-link

<!doctype html>
<html lang="en">
  <head>
    <!-- Required meta tags -->
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

    <!-- Bootstrap CSS -->
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">

    <title>Hello, world!</title>
  </head>
  <body>
<button type="button" class="btn btn-link">Click Me, Hover Me Link</button>
 <body> 
 </html>

Lien

https://getbootstrap.com/docs/4.0/components/buttons/

btn-link

0voto

Il n'y a pas de cours pour cela. Mais vous pouvez ajouter un style en ligne pour votre div ou d'autres éléments comme,

<div class="" style="cursor: pointer;">

0 votes

C'est du html valide mais ce n'est pas nécessaire : la mise à jour de la réponse acceptée à cette question note Bootstrap 4 Stable gère maintenant cela d'emblée.

Prograide.com

Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.

Powered by:

X