Teks-membenarkan - Trik CSS

Anonim

The text-justifyharta di CSS adalah seorang sahabat kepada text-alignharta yang digunakan untuk menetapkan kaedah justifikasi teks apabila text-alignditetapkan kepada justifynilai.

p ( text-align: justify; text-justify: inter-word; )

Nilai

  • inter-word: Menentukan bahawa teks dibenarkan dengan menyesuaikan jarak antara kata, dengan berkesan membuat jarak kata tambahan. Ini adalah variasi word-spacingharta tanah dengan berkesan.
  • inter-character: Menentukan bahawa teks dibenarkan dengan menyesuaikan jarak antara watak, dengan berkesan membuat jarak watak tambahan. Ini adalah variasi letter-spacingharta tanah dengan berkesan.
  • auto: Membolehkan penyemak imbas menentukan sama ada justifikasi ditangani dengan lebih baik sebagai inter-wordatau inter-character. Ini dapat membantu dalam senario multi-bahasa di mana bahasa kandungan tidak diketahui sehingga diberikan, yang membolehkan ejen pengguna penyemak imbas memilih dengan sewajarnya berdasarkan kaedah mana yang lebih sesuai dengan konteks bahasa.
  • none: Melumpuhkan kaedah pembenaran, dengan berkesan menghilangkan peluang pembenaran, atau mengatasi di mana kaedah pembenaran mungkin berlaku dalam lata.

Apa sebenarnya pembenaran?

Teks yang dibenarkan adalah cara yang menarik untuk mengatakan bagaimana teks mengisi kotak yang mengandunginya. Sebenarnya, anda mungkin sudah biasa dengan membenarkan teks dan bahkan tidak mengetahuinya. Sekiranya anda pernah menggunakan perisian penyuntingan teks seperti Word dan Google Docs, maka anda mungkin biasa dengan ikon ini:

Pilihan penjajaran teks dan justifikasi di bar alat Google Docs

Ketiga-tiga yang pertama menetapkan penjajaran teks, sama seperti sifat CSS text-align, di mana teks dapat diselaraskan ke kiri, kanan atau tengah sepenuhnya.

Ikon keempat itu adalah pilihan membenarkan dan memberitahu kandungan untuk mengisi keseluruhan lebar dokumen sehingga setiap baris mengalir tepat ke tepi, tidak kira sama ada ia mempengaruhi jarak antara kata-kata.

Menghalalkan kandungan dalam Dokumen Google menambah jarak antara kata-kata untuk memenuhi lebar dokumen penuh pada setiap baris

Properti text-justifyini membolehkan kita melakukan perkara yang sama, tetapi dengan fleksibiliti tambahan untuk menentukan sama ada kaedah jarak yang digunakan untuk membenarkan kandungan diuruskan antara kata atau watak.

Sokongan Penyemak Imbas

The text-justifyharta termasuk dalam CSS Text Modul Level 3 spesifikasi, yang kini dalam status Draf Editor pada masa penulisan ini.

Hartanah ini pada masa ini disenaraikan sebagai "berisiko" digugurkan dalam tempoh Pengesyoran Calon. Oleh itu, tidak dianjurkan untuk menggunakan harta tanah ini dalam pengeluaran kerana tidak mungkin digunakan sebagai standard di semua penyemak imbas dalam waktu terdekat.

Sokongan semasa terhad kepada Firefox 55+. Internet Explorer 11 dan Edge 14+ juga menyokong harta tanah, tetapi hanya inter-wordnilai serta nilai tidak rasmi yang tidak termasuk dalam spesifikasi W3C.

Data sokongan penyemak imbas ini berasal dari Caniuse, yang mempunyai lebih terperinci. Nombor menunjukkan bahawa penyemak imbas menyokong ciri pada versi dan ke atas.

Desktop

Chrome Firefox IE Hujung Safari
Tidak 55 11 18 Tidak

Mudah Alih / Tablet

Android Chrome Android Firefox Android Safari iOS
Tidak 85 Tidak Tidak