Bagaimana untuk memusatkan teks dalam html

Cara memusatkan teks dalam HTML

Dalam reka bentuk web, kedudukan dan susun atur elemen halaman adalah sangat penting, dan susun atur teks adalah salah satu aspek penting. Kadangkala, kita perlu memusatkan teks untuk mencapai kesan visual dan pengalaman membaca yang lebih baik. Jadi, bagaimana untuk memusatkan teks dalam HTML?

Pertama sekali, kita perlu memahami beberapa tag HTML yang biasa digunakan, iaitu: "div", "p" dan "span". Ketiga-tiga teg ini sering digunakan dalam reka bentuk web Ia boleh mengandungi teks dan elemen HTML lain, dan juga boleh menetapkan gaya elemen. Berikut ialah penggunaan asas bagi tiga teg:

Ini ialah teg p

Dalam proses memusatkan teks, kami biasanya menggunakan helaian gaya (CSS) untuk menetapkan gaya elemen. Khususnya, pemusatan teks boleh dicapai dalam tiga cara berikut:

1 Gunakan atribut penjajaran teks

Pemusatan teks secara amnya merujuk kepada pemusatan mendatar, iaitu, membiarkan teks menjadi. berpusat pada elemen Kedudukan tengah mendatar dipaparkan. Pada masa ini, kita boleh menggunakan atribut penjajaran teks untuk mencapai ini. Atribut ini boleh ditetapkan dalam gaya elemen Kod khusus adalah seperti berikut:

Dalam kod di atas, kami mula-mula mentakrifkan gaya dan menentukan bahawa atribut penjajaran teks ditetapkan ke tengah, menunjukkan bahawa penjajaran ditengah. Kemudian panggil gaya ini dalam teg "div" untuk mencapai paparan berpusat teks.

2. Gunakan atribut margin

Selain atribut penjajaran teks, kita juga boleh menggunakan atribut margin untuk mencapai kesan pemusatan teks. Khususnya, anda boleh menetapkan nilai margin-kiri dan margin-kanan kepada auto dalam gaya elemen, seperti berikut:

;

Dalam kod di atas, kami menetapkan elemen "div" dengan lebar 50% dan menetapkan atribut margin kepada 0 auto . 0 di sini bermakna jidar atas dan bawah ialah 0, dan auto bermaksud jidar kiri dan kanan berpusat. Ini mencapai paparan berpusat teks.

3 Gunakan atribut paparan dan penjajaran teks

Untuk beberapa elemen sebaris (seperti "span"), atribut jidar tidak boleh mencapai penjajaran tengah. Pada masa ini, kita boleh menggunakan atribut paparan dan penjajaran teks untuk mencapai matlamat ini. Khususnya, anda boleh menetapkan atribut paparan elemen "span" kepada "sekat", dan kemudian gunakan atribut penjajaran teks untuk memusatkan teks, seperti yang ditunjukkan di bawah:

Ini ialah teks berpusat

Dalam kod di atas, kami mula-mula menetapkan atribut paparan elemen "span" untuk menyekat , supaya ia boleh menetapkan lebar dan tinggi. Kemudian tetapkan atribut penjajaran teks ke tengah untuk memusatkan teks.

Ringkasan

Tiga kaedah di atas adalah kaedah yang sangat biasa untuk mencapai pemusatan teks Kaedah yang mana untuk digunakan bergantung pada situasi sebenar dan keutamaan peribadi. Tidak kira kaedah mana yang digunakan, anda perlu menentukan atribut dan nilai yang sepadan dalam gaya elemen untuk menukar penjajaran. Pada masa yang sama, anda juga perlu memberi perhatian kepada penggunaan dan peraturan tatabahasa bagi tag yang berbeza, dan mengikut prinsip semantik untuk meningkatkan kebolehbacaan dan kebolehselenggaraan kod.

Atas ialah kandungan terperinci Bagaimana untuk memusatkan teks dalam html. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!