Bagaimana untuk Memusatkan Kandungan dalam Twitter Bootstrap?

Cara Memusatkan Kandungan menggunakan Twitter Bootstrap

Dalam Twitter Bootstrap, anda boleh mencapai kandungan berpusat melalui kaedah yang berbeza-beza bergantung pada keperluan khusus anda.

Memusatkan Teks

Untuk menjajarkan teks dalam center, anda boleh menggunakan kelas .text-center pada bekas induk. Kelas ini, yang diperkenalkan dalam Bootstrap 2.3.0, membolehkan pemusatan teks yang mudah.

<div class="text-center">
  <h1>Bootstrap Starter Template</h1>
  <p>Example text.</p>
</div>

Nota:

• Untuk pilihan penjajaran teks dalam versi lama Bootstrap (pra-2.3.0), anda boleh menambah text-align: center pada .row atau .span12 bekas.

Kaedah Alternatif untuk Kandungan Bukan Teks

Untuk memusatkan elemen bukan teks (cth., imej atau butang), anda mempunyai pilihan berikut:

• Margin: Tambahkan jidar: 0 auto pada elemen, yang menghasilkan jidar sama pada kedua-dua belah.
• Apung: Tetapkan apungan: tiada dan kemudian tambah jidar: 0 auto pada bekas induk.
• Kelas Utiliti Bootstrap: Gunakan .pull-left, .pull-right dan .center-block kelas.
• Gaya Tersuai: Tentukan peraturan pemusatan dalam lembaran gaya tersuai anda sendiri.

Pilih kaedah yang paling sesuai dengan keperluan khusus anda dan versi Bootstrap.

Atas ialah kandungan terperinci Bagaimana untuk Memusatkan Kandungan dalam Twitter Bootstrap?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!