Rumah >hujung hadapan web >tutorial css >Bagaimanakah saya boleh menjajarkan kandungan secara menegak dalam div dengan ketinggian dan lebar yang ditentukan?

Bagaimanakah saya boleh menjajarkan kandungan secara menegak dalam div dengan ketinggian dan lebar yang ditentukan?

Mary-Kate Olsen
Mary-Kate Olsenasal
2024-11-15 04:26:02240semak imbas

How can I vertically align content within a div with defined height and width?

Penjajaran Menegak Kandungan dalam Dimensi Div Tertentu

Menjajarkan kandungan secara menegak dalam div dengan ketinggian dan lebar yang ditentukan ialah keperluan biasa dalam pembangunan web . Untuk mencapai penjajaran ini, pertimbangkan kaedah berikut:

1. Div Induk sebagai Sel Jadual:

  • Tetapkan paparan div induk kepada sel jadual dan penjajaran menegak ke tengah.
  • Penyelesaian ini menjajarkan kandungan secara menegak dalam penyemak imbas yang paparan sokongan:sel meja.

2. Div Induk dengan Paparan Blok dan Kandungan sebagai Sel Jadual:

  • Kekalkan div induk sebagai elemen blok, tetapi tetapkan paparan kandungan kepada sel jadual.
  • Ini kaedah bergantung pada keupayaan div induk untuk memegang sel jadual.

3. Div Induk Terapung dan Div Kandungan sebagai Sel Jadual:

  • Apungkan div induk dan tetapkan paparan div kandungan ke sel jadual.
  • Pendekatan ini mencapai penjajaran tanpa mengubah suai harta paparan div induk.

4. Div Induk dengan Kedudukan Relatif dan Kandungan dengan Kedudukan Mutlak:

  • Letakkan div induk secara relatif dan tetapkan div kandungan secara mutlak.
  • Pusat kandungan secara menegak dengan menetapkan bahagian atas:50 % dan margin-top:-50% pada div kandungan.
  • Kaedah ini memberikan yang tepat tetapi penjajaran manual untuk senario tertentu.

Atas ialah kandungan terperinci Bagaimanakah saya boleh menjajarkan kandungan secara menegak dalam div dengan ketinggian dan lebar yang ditentukan?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn