devstory

Le Tutoriel de Bootstrap Visibility Utility

1- Boostrap Visibility

En CSS il y a deux manières de cacher un élément :
  1. Utilisez CSS Property: {display: none}.
  2. Utilisez​​​​​​​  CSS Property: {visibility: hidden}.
Maitenant je vous donnerai des explications sur la différence entre ces deux manières.

{display: none}

{display: none} cache l'élément et libère l'espace occupé par l'élément. Cela signifie qu'une fois l'élément est caché, d'autres éléments peuvent occuper son espace.

{visibility: hidden}

{visibility: hidden} va cacher l'élément mais ne libère pas l'espace occupé par l'élément.
Si l'élément est caché par {visibility: hidden} pour l'afficher de nouveau, vous devez utiliser  {visibility: visible}.

Bootstrap Visibility

Au lieu d'utiliser CSS {visibility: hidden} & {visibility: visible}, Bootstrap vous fournit deux classes .invisible & .visible :
.visible, .invisible
// Class
.visible {
  visibility: visible;
}

.invisible {
  visibility: hidden;
}
Peut-être que vous êtes intéressé

Voici des leçons en ligne à part du site web o7planning que nous recommandons. La liste comprend des leçons en ligne et celles en promo.