Maison  >  Article  >  interface Web  >  Comment supprimer l'icône dans le bootstrap

Comment supprimer l'icône dans le bootstrap

藏色散人
藏色散人original
2020-12-17 09:29:362446parcourir

Comment supprimer des icônes dans bootstrap : ouvrez d'abord le fichier de code correspondant ; puis supprimez simplement l'icône en définissant la propriété background d'une classe CSS ou d'une pseudo-classe spécifique sur none.

Comment supprimer l'icône dans le bootstrap

L'environnement d'exploitation de ce tutoriel : Système Windows 7, bootsrap version 3.3.7 Cette méthode convient à toutes les marques d'ordinateurs.

Recommandé : "Tutoriel bootstrap" "Tutoriel vidéo CSS"

Supprimer l'icône de vérification de Bootstrap

Question spécifique :

J'essaie de supprimer ces icônes de validation de Bootstrap ("x" et "check"), mais j'ai tout regardé et je ne trouve pas où elles se trouvent est .

Vous pouvez également y voir ce JSFiddle.

<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/css/bootstrap.min.css" rel="stylesheet" />
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/js/bootstrap.min.js"></script>
<form class="was-validated">
  <div class="form-group">
    <select class="custom-select" required>
      <option value="">Open this select menu</option>
      <option value="1">One</option>
      <option value="2">Two</option>
      <option value="3">Three</option>
    </select>
    <div class="invalid-feedback">Example invalid custom select feedback</div>
  </div>
</form>

Comment implémenter :

Vous pouvez simplement supprimer l'icône en définissant la propriété background d'une classe/pseudo-classe CSS spécifique sur none

.was-validated .custom-select:valid {
  background-image: none;
}
.was-validated .custom-select:invalid {
  background-image: none;
}

Si vous souhaitez supprimer l'icône de validation mais conserver l'icône en forme de flèche sur l'entrée de sélection, vous pouvez le faire en définissant l'arrière-plan sur

.was-validated .custom-select:invalid {
     background: url("data:image/svg+xml,%3csvg xmlns=&#39;http://www.w3.org/2000/svg&#39; viewBox=&#39;0 0 4 5&#39;%3e%3cpath fill=&#39;%23343a40&#39; d=&#39;M2 0L0 2h4zm0 5L0 3h4z&#39;/%3e%3c/svg%3e") no-repeat right .75rem center/8px 10px;
}

Pour plus de connaissances sur la programmation, veuillez visiter : Tutoriel de programmation ! !

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn