Bagaimanakah `menjajarkan-menegak` Kedudukan Harta Elemen Sebaris?

Memahami Sifat Penjajaran Menegak

Apabila bekerja dengan penjajaran menegak, memahami prinsip di sebalik sifat "penjajaran menegak" adalah penting. Sifat ini menentukan cara elemen sebaris diletakkan secara menegak berbanding teks atau elemen sekelilingnya.

Keperluan Elemen Sebaris

Sifat "menjajarkan menegak" hanya boleh digunakan kepada elemen sebaris, seperti span, img, dan a. Elemen sebaris mengalir secara semula jadi dalam aliran teks.

Pertimbangan Ketinggian Garis

Untuk elemen yang biasanya tidak mempunyai ketinggian garis yang ditentukan, seperti imej atau ikon, ketinggian garisan mesti ditetapkan untuk membolehkan penjajaran menegak yang betul.

Keperluan Nilai Ketinggian

Ketinggian elemen di mana "penjajaran menegak" digunakan hendaklah mempunyai nilai statik (bukan peratus atau auto), memastikan penjajaran menegak yang konsisten.

Mengandungi Elemen lwn. Elemen Sasaran

Sifat "penjajaran menegak" boleh digunakan pada kedua-dua elemen yang mengandungi dan elemen sasaran yang harus dipengaruhinya. Walau bagaimanapun, penggunaannya pada elemen yang mengandungi lebih diutamakan kerana ia mempengaruhi semua elemen sebaris dalam bekas itu.

Memahami Kotak Garisan

Sifat "penjajaran menegak" menjajarkan pusat menegak elemen dengan kotak baris teks sekeliling. Kotak baris merangkumi satu baris teks, bukan keseluruhan ketinggian bekas.

Demonstrasi JsFiddle

Contoh JsFiddle yang disediakan menggambarkan prinsip penjajaran menegak. Bekas luar ditetapkan kepada ketinggian 200px dan elemen dalam ditetapkan kepada blok sebaris dan juga ketinggian 200px. Pengepala dalam elemen dalam ditetapkan kepada "vertical-align: middle;".

Hasil yang dijangkakan adalah untuk pengepala dipusatkan secara menegak dalam elemen dalam. Walau bagaimanapun, oleh kerana pengepala mengandungi berbilang baris teks, penjajaran menegak digunakan pada kotak baris individu, bukan keseluruhan ketinggian. Akibatnya, pengepala hanya dijajarkan sebahagiannya dalam bekas.

Atas ialah kandungan terperinci Bagaimanakah `menjajarkan-menegak` Kedudukan Harta Elemen Sebaris?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!