Rumah >hujung hadapan web >tutorial css >Bagaimanakah Saya Boleh Memaparkan Teks Berbilang Warna dalam Kawasan Teks?

Bagaimanakah Saya Boleh Memaparkan Teks Berbilang Warna dalam Kawasan Teks?

Susan Sarandon
Susan Sarandonasal
2024-11-29 11:34:10265semak imbas

How Can I Display Multi-Colored Text in a Text Area?

Teks Berbilang Warna dalam Kawasan Teks

Adalah sukar untuk memaparkan teks dengan warna yang berbeza-beza dalam kawasan teks atau medan input. Walau bagaimanapun, terdapat penyelesaian alternatif menggunakan atribut contenteditable.

Penyelesaian Menggunakan contenteditable

Atribut contenteditable menjadikan elemen HTML boleh diedit tanpa mengubahnya menjadi elemen bentuk. Ini membolehkan anda menggunakan HTML dan CSS untuk menggayakan teks dalam elemen, termasuk memberikan warna yang berbeza.

Kod Contoh

<div>

Penjelasan

  1. Buat elemen div dengan id "mytxt" dan tetapkan atribut contenteditable kepada "benar."
  2. Di dalam div, gunakan elemen untuk membalut teks yang anda ingin warnakan.
  3. Gunakan gaya warna yang berbeza pada elemen span menggunakan CSS.
  4. Hasil

    The kod di atas akan mencipta elemen div yang boleh diedit oleh pengguna. Teks "Bob" akan muncul dalam warna biru, dan teks "Joe" akan muncul dalam warna hijau. Pengguna juga boleh mengedit atau memadam teks dan menukar warna seperti yang dikehendaki.

    Nota:

    Penyelesaian ini bergantung pada HTML dan CSS dan mungkin tidak serasi dengan semua pelayar atau peranti. Jika anda memerlukan penyelesaian yang lebih mantap, pertimbangkan untuk menggunakan pustaka pihak ketiga atau melaksanakan penyelesaian JavaScript tersuai.

    Atas ialah kandungan terperinci Bagaimanakah Saya Boleh Memaparkan Teks Berbilang Warna dalam Kawasan Teks?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn