Kaedah melukis termasuk menggunakan atribut flex-direction, justify-content attribute, align-item attribute, flex-wrap attribute, align-content attribute, flex-grow attribute, flex-shrink attribute, flex-basis attribute, order attribute, dll. Pengenalan terperinci: 1. Atribut arah lentur menentukan arah susunan item pada paksi utama, dsb.
Sistem pengendalian tutorial ini: sistem Windows 10, komputer Dell G3.
Flexbox ialah modul CSS untuk susun atur fleksibel dalam bekas. Dengan menggunakan reka letak anjal, kami boleh melaksanakan reka bentuk responsif dan susun atur penyesuaian dengan mudah. Berikut ialah beberapa cara untuk melukis dengan susun atur fleksibel:
Gunakan sifat flex-direction : Sifat
flex-direction menentukan arah di mana item disusun pada paksi utama. Anda boleh menggunakan baris, lajur, baris-terbalik dan lajur-terbalik untuk menetapkan susunan mendatar atau menegak.
Gunakan sifat justify-content : Sifat
justify-content menentukan penjajaran item pada paksi utama. Anda boleh menggunakan flex-start, flex-end, tengah, ruang-antara, ruang-keliling dan ruang-sekata untuk menetapkan penjajaran item pada paksi utama.
Gunakan sifat align-item : Sifat
align-item menentukan cara item dijajarkan pada paksi silang. Anda boleh menggunakan mula lentur, hujung lentur, tengah, garis dasar dan regangan untuk menetapkan penjajaran item pada paksi silang.
Gunakan sifat flex-wrap : Sifat
flex-wrap menentukan sama ada sesuatu item dibalut. Anda boleh menggunakan nowrap, wrap dan wrap-reverse untuk menetapkan kaedah pembalut baris projek.
Gunakan atribut align-content : Atribut
align-content menentukan penjajaran item berbilang baris pada paksi silang. Anda boleh menggunakan mula lentur, hujung lentur, tengah, ruang antara, ruang sekeliling dan regangan untuk menetapkan penjajaran item berbilang baris pada paksi silang.
Gunakan sifat flex-grow: Sifat
flex-grow menentukan nisbah pembesaran item. Anda boleh menggunakan nombor untuk menetapkan nisbah pembesaran item Lebih besar nombor, lebih besar nisbah pembesaran item.
Gunakan sifat flex-shrink : Sifat
flex-shrink menentukan nisbah pengecutan sesuatu item. Anda boleh menggunakan nombor untuk menetapkan nisbah pengurangan item Lebih besar nombor, lebih besar nisbah pengurangan item.
Gunakan sifat flex-basis: Sifat
flex-basis menentukan saiz awal item. Anda boleh menggunakan nilai panjang atau auto untuk menetapkan saiz awal item.
Gunakan atribut pesanan : Atribut
tertib menentukan susunan item diisih. Anda boleh menggunakan integer untuk menetapkan susunan item Semakin kecil nombor, semakin tinggi item tersebut.
Di atas adalah beberapa kaedah melukis menggunakan susun atur yang fleksibel. Dengan menggunakan atribut ini secara fleksibel, kita boleh mencapai pelbagai kesan reka letak yang kompleks dengan mudah. Reka letak fleksibel bukan sahaja menyediakan kaedah susun atur yang ringkas dan mudah digunakan, tetapi juga boleh menyesuaikan diri dengan keperluan peranti dan saiz skrin yang berbeza, memberikan kemudahan untuk reka bentuk responsif.
Atas ialah kandungan terperinci Apakah kaedah lukisan susun atur yang fleksibel?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!