Zichtbaarheid

Beheer de zichtbaarheid van elementen, zonder hun weergave te wijzigen, met zichtbaarheidshulpprogramma's.

Stel het visibilityaantal elementen in met onze zichtbaarheidshulpprogramma's. Deze hulpprogrammaklassen wijzigen de displaywaarde helemaal niet en hebben geen invloed op de lay-out - .invisibleelementen nemen nog steeds ruimte in beslag op de pagina.

Elementen met de .invisibleklas worden zowel visueel als voor gebruikers van ondersteunende technologie/schermlezers verborgen.

Toepassen .visibleof .invisibleindien nodig.

<div class="visible">...</div>
<div class="invisible">...</div>

// Class
.visible {
  visibility: visible !important;
}
.invisible {
  visibility: hidden !important;
}

Sass

Hulpprogramma's-API

Zichtbaarheidshulpprogramma's worden gedeclareerd in onze hulpprogramma's-API in scss/_utilities.scss. Leer hoe u de hulpprogramma's-API gebruikt.

    "visibility": (
      property: visibility,
      class: null,
      values: (
        visible: visible,
        invisible: hidden,
      )
    )