Comment définir la barre de progression dans bootstrap4-Tutoriel d'amorçage-php.cn

Comment définir la barre de progression dans bootstrap4

(*-*)浩

Libérer： 2019-07-27 16:54:38

original

2719 Les gens l'ont consulté

Le composant bootstrap est souvent utilisé dans le développement front-end. Aujourd'hui, cet article partagera avec vous l'utilisation de base de la barre de progression du composant bootstrap. Les amis qui en ont besoin peuvent s'y référer

<.>

Comment définir la barre de progression dans bootstrap4

Utilisation de base de la barre de progression (Apprentissage recommandé : Tutoriel vidéo Bootstrap)

S'appuie principalement sur .progress et .progress -bar

aria-valuenow Indique la valeur actuelle

aria-valuemin indique la valeur minimale

aria-valuemax indique la valeur maximale

largeur : 60 % indique la position actuelle de la barre de progression

barre de progression Peut afficher le processus d'achèvement des tâches de l'utilisateur.

Les étapes pour créer une barre de progression de base sont les suivantes :

Ajoutez un

Ensuite, à l'intérieur du

ci-dessus, ajoutez un

vide avec la classe .progress-bar .

Ajoutez un attribut de style avec une largeur exprimée en pourcentage, par exemple style="width:70%" signifie que la barre de progression est à la position 70%.

Exemple :

<div class="progress">
  <div class="progress-bar" style="width:70%"></div>
</div>

Copier après la connexion

Pour plus d'articles techniques liés à Bootstrap, veuillez visiter la colonne

Tutoriel Bootstrap pour apprendre !

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!

Étiquettes associées：

bootstrap4

source：php.cn

Article précédent：Comment configurer la boîte modale dans bootstrap4 Article suivant：Comment configurer une boîte contextuelle dans bootstrap4

Déclaration de ce site Web

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

Derniers articles par auteur