Bagaimana untuk Membuat DIV Mengembangkan Pusat dengan Peralihan CSS?

Memperluas DIV dari Tengah Menggunakan CSS

Dalam pengembangan dari masalah CSS tengah ini, matlamat kami adalah untuk mengubah elemen DIV dari pusatnya ke luar, mencapai kesan berbeza daripada pengembangan biasa dari sudut kiri atas. Dengan menggunakan peralihan CSS, kami berusaha untuk mengawal lebar, ketinggian dan kedudukan pengembangan untuk memberikan gambaran pertumbuhan dari tengah.

Kunci Pengembangan

Rahsianya terletak pada memanipulasi harta margin melalui formula yang tepat. Dengan mengalihkan margin, kami boleh menentukan jumlah pengembangan yang diingini di sekitar pusat DIV.

Pilihan Pengembangan

Untuk mencapai kesan pengembangan pertengahan, kami membentangkan beberapa pilihan:

Dalam pilihan ini, DIV mengembang ke atas elemen di sekelilingnya, menyebabkan ia beralih sewajarnya.

Pilihan 3: Peluasan dan Peralihan Elemen

Kaedah ini menggabungkan pengembangan dan peralihan elemen, membolehkan DIV berkembang bukan sahaja ke atas elemen tetapi juga menganjak elemen selepasnya dalam aliran.

Senario Tambahan

Peluasan Bukan Persegi:

Teknik ini berfungsi walaupun untuk DIV bukan persegi, membenarkan pelbagai bentuk.

Peluasan Responsif:

Oleh membuat pengubahsuaian kecil pada formula, malah kami boleh mencapai pengembangan responsif, menampung saiz skrin yang berbeza dengan lancar.

Atas ialah kandungan terperinci Bagaimana untuk Membuat DIV Mengembangkan Pusat dengan Peralihan CSS?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!