Penyertaan teks berbilang warna dalam kawasan teks dan medan input telah menarik minat anda, dan anda mendapatkan panduan tentang cara mendekati perkara ini tugasan. Walaupun pemikiran awal anda melibatkan gabungan CSS, JavaScript dan sentuhan ajaib, adalah penting untuk memahami batasan yang terlibat.
Cabaran Teknikal
Ia bukan mungkin untuk mencapai penonjolan teks berbilang warna secara langsung dalam kawasan teks atau medan input menggunakan CSS. Elemen ini tidak mempunyai sokongan untuk menggunakan gaya yang berbeza pada bahagian teks tertentu. Percubaan untuk mengubah suai warna teks akan menjejaskan keseluruhan kandungan dalam kawasan input atau teks.
Penyelesaian: Hayati Elemen Boleh Sunting Kandungan
Untuk mencapai penyerlahan sintaks dalam teks interaktif medan, anda perlu mengubah pendekatan anda ke arah menggunakan elemen boleh diedit kandungan. Elemen khas ini membolehkan penciptaan kawasan teks boleh diedit dalam dokumen HTML. Dengan menggabungkan fungsi Boleh Diedit kandungan, anda memperoleh keupayaan untuk menggunakan gaya CSS yang berbeza pada bahagian teks yang berbeza.
Contoh
Pertimbangkan coretan kod berikut sebagai contoh:
<code class="html"><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false"> <div class="snippet-code"> <pre class="snippet-code-html lang-html prettyprint-override"><div contenteditable="true"> <span style="color: blue">var</span> foo = <span style="color: green">"bar"</span>; </div>
Dalam contoh ini, atribut boleh diedit kandungan telah digunakan pada
Atas ialah kandungan terperinci Bagaimanakah Saya Boleh Mencapai Serlahan Teks Berbilang Warna dalam Kawasan Teks dan Input?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!