Dit artikel is een spiegelartikel van machinevertaling, klik hier om naar het oorspronkelijke artikel te gaan.

Bekijken: 12583|Antwoord: 0

[Bootstrap] Hoe je elementen toont en verbergt met Bootstrap4

[Link kopiëren]
Geplaatst op 04-04-2019 10:46:25 | | | |
Hoe je elementen toont en verbergt met Bootstrap4

Voor snellere ontwikkeling van mobiele apparaten gebruik responsieve displayklassen om elementen per apparaat te tonen en te verbergen. Vermijd het maken van volledig verschillende versies van dezelfde site, maar verberg elementen voor elk schermformaat dienovereenkomstig.

Om elementen te verbergen, gebruik je simpelweg.d-geenklasse of een van hen.d-{sm,md,lg,xl}-geenklasse om responsieve schermwijzigingen te maken.

Om elementen alleen op een bepaald scherminterval weer te geven, kun je er één instellen.d-*-geenKlasse en één.d-*-*Klassen worden bijvoorbeeld gegroepeerd,.d-geen .d-md-block .d-xl-geenElementen van alle schermformaten worden verborgen, behalve voor middelgrote en grote apparaten.

Renderings:



Show/hide voor breakpoint en down:

  • hidden-xs-down (hidden-xs) = d-geen d-sm-block
  • hidden-sm-down (hidden-sm hidden-xs) = d-none d-md-block
  • hidden-md-down (hidden-md hidden-sm hidden-xs) = d-none d-lg-block
  • hidden-lg-down = d-geen d-xl-block
  • hidden-xl-down (n.a 3.x) = d-none (hetzelfde als hidden)


Toon/verberg voor breekpunt en hoger:

  • hidden-xs-up = d-none (hetzelfde als hidden)
  • hidden-sm-up = d-sm-none
  • hidden-md-up = d-md-none
  • hidden-lg-up = d-lg-none
  • hidden-xl-up (n/a 3.x) = d-xl-none


Alleen laten zien/verbergen voor één breekpunt:

  • hidden-xs (alleen) = d-geen d-sm-block (hetzelfde als hidden-xs-down)
  • hidden-sm (alleen) = d-block d-sm-none d-md-block
  • hidden-md (alleen) = d-blok d-md-geen d-lg-blok
  • hidden-lg (alleen) = d-blok d-lg-geen d-xl-blok
  • hidden-xl (n/a 3.x) = d-blok d-xl-none
  • Zichtbare-xs (alleen) = d-blok d-sm-geen
  • Visible-SM (alleen) = D-geen d-sm-blok d-md-geen
  • Visible-MD (alleen) = D-Geen D-MD-Blok D-LG-Geen
  • Visible-LG (alleen) = D-geen d-lg-blok d-xl-geen
  • Zichtbaar-XL (N/A 3.X) = D-Niets D-XL-Blok


Visualisatie:



Referentielinks:https://getbootstrap.com/docs/4.0/utilities/display/





Vorig:Welke kwaliteiten zou een softwarearchitect moeten hebben?
Volgend:Kan @Autowired niet injecteren in Listener
Disclaimer:
Alle software, programmeermaterialen of artikelen die door Code Farmer Network worden gepubliceerd, zijn uitsluitend bedoeld voor leer- en onderzoeksdoeleinden; De bovenstaande inhoud mag niet worden gebruikt voor commerciële of illegale doeleinden, anders dragen gebruikers alle gevolgen. De informatie op deze site komt van het internet, en auteursrechtconflicten hebben niets met deze site te maken. Je moet bovenstaande inhoud volledig van je computer verwijderen binnen 24 uur na het downloaden. Als je het programma leuk vindt, steun dan de echte software, koop registratie en krijg betere echte diensten. Als er sprake is van een inbreuk, neem dan contact met ons op via e-mail.

Mail To:help@itsvse.com