Selaras teks - Trik CSS

Anonim

The text-alignharta di CSS digunakan untuk menjajarkan kandungan dalaman elemen blok.

p ( text-align: center; )

Ini adalah nilai tradisional untuk menyelaraskan teks:

  • left- Nilai lalai. Kandungan sejajar di sebelah kiri.
  • right - Kandungan sejajar di sebelah kanan.
  • center- Kandungan berpusat di antara tepi kiri dan kanan. Ruang putih di sisi kiri dan kanan setiap garis harus sama.
  • justify - Isi ruang keluar sedemikian rupa sehingga sebanyak mungkin blok masuk ke satu baris dan kata pertama pada baris itu berada di sepanjang tepi kiri dan kata terakhir di sepanjang tepi kanan.
  • inherit - Nilai akan menjadi apa sahaja elemen induk.

"Kandungan" digunakan di sini sebagai istilah dan bukan "teks", kerana sementara teks-teks tentu mempengaruhi teks, itu mempengaruhi semua elemen sebaris atau sebaris dalam wadah itu.

Terdapat dua nilai baru dalam CSS3 juga, permulaan dan akhir. Nilai-nilai ini menjadikan sokongan berbilang bahasa lebih mudah Contohnya, bahasa Inggeris adalah bahasa kiri-ke-kanan (ltr) dan bahasa Arab adalah bahasa kanan-ke-kiri (rtl). Menggunakan "kanan" dan "kiri" untuk nilai terlalu kaku dan tidak menyesuaikan diri ketika arah berubah. Nilai-nilai baru ini menyesuaikan diri:

  • start - Sama seperti "kiri" di ltr, sama dengan "kanan" di rtl.
  • end - Sama dengan "kanan" di ltr, sama dengan "kiri" di rtl.

Terdapat juga match-parent, yang serupa dengan inherit, hanya bahawa nilai baru dikira berdasarkan arah elemen semasa dan bukannya, anda tahu, tidak melakukannya.

Terdapat beberapa perkara dalam spesifikasi yang belum mempunyai sokongan penyemak imbas. Salah satunya adalah nilai "permulaan akhir" yang akan menyelaraskan baris pertama seolah-olah "permulaan" dan baris berikutnya seolah-olah "akhir". Yang lain adalah memberikan nilai rentetan, seperti text-align: "." start;teks akan sama sepanjang kejadian pertama, seperti untuk membariskan lajur angka di sepanjang titik perpuluhan.

Contoh

Teks ini sejajar kiri.

Teks ini sejajar dengan tepat.

Saya berpusat!

Saya dibenarkan. Saya mengisi ruang dengan tepat (kecuali pada baris terakhir), walaupun saya perlu meregangkan sedikit masa.

Saya mewarisi penjajaran ibu bapa saya. Dalam kes ini, itu bermaksud kiri.

Sokongan Penyemak Imbas

Untuk kiri, kanan, tengah, sahkan:

Chrome Safari Firefox Opera IE Android iOS
Sebarang Sebarang Sebarang 3.5+ 3+ Sebarang Sebarang

Untuk startdan endnilai:

Chrome Safari Firefox Opera IE Android iOS
Sebarang 3.1+ 3.6+ Tiada Tiada Sebarang Sebarang