Isi kandungan:

Apakah bekas Flexbox?
Apakah bekas Flexbox?

Video: Apakah bekas Flexbox?

Video: Apakah bekas Flexbox?
Video: Flexbox Tutorial Bahasa Indonesia (Lengkap termasuk PDF) 2024, Mungkin
Anonim

A bekas lentur mengembangkan item untuk mengisi ruang kosong yang tersedia atau mengecilkannya untuk mengelakkan limpahan. Paling penting, yang kotak lentur susun atur adalah arah-agnostik berbanding dengan susun atur biasa (blok yang berasaskan menegak dan sebaris yang berasaskan mendatar).

Berkenaan dengan ini, bagaimanakah anda menggunakan Flexbox?

Ringkasan

  1. Gunakan paparan: flex; untuk membuat bekas fleksibel.
  2. Gunakan justify-content untuk menentukan penjajaran mendatar item.
  3. Gunakan align-item untuk menentukan penjajaran menegak item.
  4. Gunakan flex-direction jika anda memerlukan lajur dan bukannya baris.
  5. Gunakan nilai baris-terbalik atau lajur-terbalik untuk menyelak tertib item.

bagaimana anda membuat bekas Flex? Sebelum anda boleh menggunakan mana-mana kotak lentur harta, anda perlu mentakrifkan a bekas lentur dalam susun atur anda. awak buat bekas fleksibel dengan menetapkan sifat paparan unsur kepada salah satu daripada kotak lentur nilai susun atur: lentur atau sebaris- lentur . Secara lalai, lentur item dibentangkan secara mendatar pada paksi utama dari kiri ke kanan.

Dengan cara ini, untuk apa Flexbox digunakan?

Flexbox ialah model susun atur yang membolehkan elemen menjajarkan dan mengagihkan ruang dalam bekas. Menggunakan lebar dan ketinggian yang fleksibel, elemen boleh diselaraskan untuk mengisi ruang atau mengagihkan ruang antara elemen, yang menjadikannya alat yang hebat untuk gunakan untuk sistem reka bentuk responsif.

Apakah orientasi lalai dalam bekas Flex?

The lalai susunan selepas menggunakan paparan: lentur adalah untuk item disusun di sepanjang paksi utama dari kiri ke kanan. Animasi di bawah menunjukkan apa yang berlaku apabila lentur - arah : lajur ditambah pada bekas unsur. Anda juga boleh tetapkan flex - arah ke baris-terbalik dan lajur-terbalik.

Disyorkan: