Artikel ini adalah artikel cermin dari terjemahan mesin, silakan klik di sini untuk melompat ke artikel aslinya.

Melihat: 12583|Jawab: 0

[Bootstrap] Cara menampilkan dan menyembunyikan elemen menggunakan Bootstrap4

[Salin tautan]
Diposting pada 04/04/2019 10.46.25 | | | |
Cara menampilkan dan menyembunyikan elemen menggunakan Bootstrap4

Untuk pengembangan perangkat seluler yang lebih cepat, gunakan kelas tampilan responsif untuk menampilkan dan menyembunyikan elemen berdasarkan perangkat. Hindari membuat versi yang sama sekali berbeda dari situs yang sama, tetapi sembunyikan elemen untuk setiap ukuran layar yang sesuai.

Untuk menyembunyikan elemen, cukup gunakan.d-tidak adakelas atau salah satunya.d-{sm,md,lg,xl}-noneuntuk membuat perubahan layar responsif.

Untuk menampilkan elemen hanya pada interval ukuran layar tertentu, Anda dapat mengaturnya.d-*-noneKelas dan satu.d-*-*dikelompokkan bersama, misalnya,.d-none .d-md-blok .d-xl-noneElemen dari semua ukuran layar akan disembunyikan, kecuali untuk perangkat sedang dan besar.

Rendering:



Tampilkan/sembunyikan untuk breakpoint dan turun:

  • hidden-xs-down (hidden-xs) = d-none 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-none d-xl-block
  • hidden-xl-down (n/a 3.x) = d-none (sama dengan tersembunyi)


Tampilkan/sembunyikan untuk breakpoint dan naik:

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


Tampilkan/sembunyikan hanya untuk satu titik henti:

  • hidden-xs (hanya) = d-none d-sm-block (sama dengan hidden-xs-down)
  • hidden-sm (hanya) = blok-d d-sm-none d-md-block
  • hidden-md (hanya) = blok-d d-md-none d-lg-block
  • hidden-lg (hanya) = blok-d d-lg-none d-xl-block
  • hidden-xl (n/a 3.x) = d-block d-xl-none
  • visible-xs (hanya) = blok d d-sm-none
  • visible-sm (hanya) = d-none d-sm-block d-md-none
  • visible-md (hanya) = d-none d-md-block d-lg-none
  • visible-lg (hanya) = d-none d-lg-block d-xl-none
  • visible-xl (n/a 3.x) = d-none d-xl-block


Visualisasi:



Tautan referensi:https://getbootstrap.com/docs/4.0/utilities/display/





Mantan:Kualitas apa yang harus dimiliki seorang arsitek perangkat lunak?
Depan:Tidak dapat menyuntikkan @Autowired di Listener
Sanggahan:
Semua perangkat lunak, materi pemrograman, atau artikel yang diterbitkan oleh Code Farmer Network hanya untuk tujuan pembelajaran dan penelitian; Konten di atas tidak boleh digunakan untuk tujuan komersial atau ilegal, jika tidak, pengguna akan menanggung semua konsekuensi. Informasi di situs ini berasal dari Internet, dan sengketa hak cipta tidak ada hubungannya dengan situs ini. Anda harus sepenuhnya menghapus konten di atas dari komputer Anda dalam waktu 24 jam setelah pengunduhan. Jika Anda menyukai program ini, harap dukung perangkat lunak asli, pembelian pendaftaran, dan dapatkan layanan asli yang lebih baik. Jika ada pelanggaran, silakan hubungi kami melalui email.

Mail To:help@itsvse.com