Bagaimanakah Saya Boleh Memaparkan Elipsis Limpahan Teks di Sebelah Kiri?

Elipsis Limpahan Teks di Sebelah Kiri:

Anda mungkin menghadapi senario di mana anda mempunyai senarai laluan atau sebarang nilai teks yang melebihi lebar paparan. Untuk menyelesaikan masalah ini, anda mungkin mahu melaksanakan sifat limpahan teks untuk memotong teks. Walau bagaimanapun, anggap maklumat kritikal terletak di hujung teks. Dalam kes itu, anda lebih suka elipsis muncul di sebelah kiri, memastikan kandungan paling kanan kekal kelihatan.

Penyelesaian kepada masalah ini boleh didapati dalam biola JavaScript yang disediakan. Di sini, gabungan sifat arah, penjajaran teks dan limpahan teks digunakan. Perlu diingat bahawa menurut dokumentasi MDN, mungkin terdapat pilihan masa hadapan untuk menentukan kedudukan elipsis di sebelah kiri menggunakan jenis limpahan. Walau bagaimanapun, ciri ini masih dianggap sebagai percubaan.

1. Arah: Sifat ini melaraskan arah teks ke kanan-ke-kiri (RTL) menggunakan direction:rtl;.
2. Penjajaran teks: Sifat penjajaran teks menjajarkan teks dalam elemen induknya kepada kiri.
3. Limpahan teks: Sifat limpahan teks ditetapkan kepada elipsis. Ini dengan berkesan memotong teks dan memaparkan elipsis jika teks melangkaui lebar elemen.

Berikut ialah biola JS yang disediakan untuk ilustrasi lanjut:

JavaScript Biola

CSS:

p {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  width: 170px;
  border: 1px solid #999;
  direction: rtl;
  text-align: left;
}

HTML:

<p>
  first > second > third<br>
  second > third > fourth > fifth > sixth<br>
  fifth > sixth > seventh > eighth > ninth
</p>

Atas ialah kandungan terperinci Bagaimanakah Saya Boleh Memaparkan Elipsis Limpahan Teks di Sebelah Kiri?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!