Rumah >hujung hadapan web >tutorial css >Bagaimanakah Saya Mendatar Memusatkan Elemen Div dalam CSS?

Bagaimanakah Saya Mendatar Memusatkan Elemen Div dalam CSS?

Barbara Streisand
Barbara Streisandasal
2024-12-23 10:24:28983semak imbas

How Do I Horizontally Center a Div Element in CSS?

Menguasai Pemusatan Mendatar untuk

Elemen dengan CSS

Bayangkan halaman yang dihiasi dengan

elemen yang terapung dengan tenang di tengahnya, mempamerkan kandungannya dalam penjajaran sempurna dengan teks sekeliling. Bagaimanakah anda dengan mudah mencapai ini dengan CSS? Mari kita rungkai pendekatan paling mudah untuk kedua-dua tetap dan lebar boleh ubah
elemen.

Lebar Tetap

Untuk

dihiasi dengan lebar yang telah ditetapkan, sifar pada tengahnya adalah mudah dengan arahan CSS berikut:

#yourdiv {
  margin: 0 auto;
  width: 400px; /* Set the desired width */
}

Lebar Pembolehubah

Apabila berhadapan dengan a

yang lebarnya mungkin berubah-ubah, taktik licik muncul:

#wrapper {
  text-align: center;
}

#yourdiv {
  display: inline-block;
}

Susunan ini memastikan bahawa elemen memusatkan kandungannya, termasuk yang sangat misteri. Oleh itu, tanpa mengira panjang kandungan,

mendapat tempat yang sepatutnya di tengah-tengah halaman web anda.

Atas ialah kandungan terperinci Bagaimanakah Saya Mendatar Memusatkan Elemen Div dalam CSS?. 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