Denne artikel er en spejling af maskinoversættelse, klik venligst her for at springe til den oprindelige artikel.

Architect_Programmer_Code Landbrugsnetværk»Arkitekt › Front-end design og web › Forrammen › Sådan viser og skjuler du elementer ved hjælp af Bootstrap4
Udsigt: 12583|Svar: 0

[Bootstrap] Sådan viser og skjuler du elementer ved hjælp af Bootstrap4

[Kopier link]
Opslået på 04/04/2019 10.46.25 | | | |
Sådan viser og skjuler du elementer ved hjælp af Bootstrap4

For hurtigere udvikling af mobile enheder kan man bruge responsive displayklasser til at vise og skjule elementer efter enhed. Undgå at oprette helt forskellige versioner af det samme site, men skjul elementer for hver skærmstørrelse derefter.

For at skjule elementer, brug blot.d-ingenklasse eller en af dem.d-{sm,md,lg,xl}-ingenklasse for at lave eventuelle responsive skærmændringer.

For kun at vise elementer på et givent skærmstørrelsesinterval kan du sætte et.d-*-ingenKlasse og én.d-*-*Klasser grupperes sammen, for eksempel,.d-ingen .d-md-blok .d-xl-ingenElementer i alle skærmstørrelser vil være skjult, undtagen for mellemstore og store enheder.

Gengivelser:



Vis/skjul for breakpoint og ned:

  • hidden-xs-down (hidden-xs) = d-ingen d-sm-blok
  • hidden-sm-down (hidden-sm hidden-xs) = d-none d-md-block
  • hidden-md-down (hidden-md hidden-sm hidden-xs) = d-ingen d-lg-blok
  • hidden-lg-down = d-ingen d-xl-blok
  • hidden-xl-down (n/a 3.x) = d-none (samme som hidden)


Vis/skjul for breakpoint og opad:

  • hidden-xs-up = d-none (samme som 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


Vis/skjul kun for et enkelt breakpoint:

  • hidden-xs (kun) = d-ingen d-sm-blok (samme som hidden-xs-down)
  • hidden-sm (kun) = d-blok d-sm-ingen d-md-blok
  • hidden-md (kun) = d-blok d-md-ingen d-lg-blok
  • hidden-lg (kun) = d-blok d-lg-ingen d-xl-blok
  • hidden-xl (n/a 3.x) = d-blok d-xl-ingen
  • synlig-xs (kun) = d-blok d-sm-ingen
  • visible-sm (kun) = d-ingen d-sm-blok d-md-none
  • visible-md (kun) = d-ingen d-md-blok d-lg-none
  • visible-lg (kun) = d-ingen d-lg-blok d-xl-ingen
  • Visible-XL (N/A 3.x) = D-Ingen D-XL-blok


Visualisering:



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





Tidligere:Hvilke kvaliteter bør en softwarearkitekt have?
Næste:Kan ikke indsætte @Autowired i Listener

Relaterede indlæg
Ansvarsfraskrivelse:
Al software, programmeringsmaterialer eller artikler udgivet af Code Farmer Network er kun til lærings- og forskningsformål; Ovenstående indhold må ikke bruges til kommercielle eller ulovlige formål, ellers skal brugerne bære alle konsekvenser. Oplysningerne på dette site kommer fra internettet, og ophavsretstvister har intet med dette site at gøre. Du skal slette ovenstående indhold fuldstændigt fra din computer inden for 24 timer efter download. Hvis du kan lide programmet, så understøt venligst ægte software, køb registrering og få bedre ægte tjenester. Hvis der er nogen overtrædelse, bedes du kontakte os via e-mail.
Mail To:help@itsvse.com