如何在文字區域顯示多色文字？

文字區域中的多色文字

在文字區域或輸入欄位中顯示不同顏色的文字可能具有挑戰性。但是，還有使用 contenteditable 屬性的替代解決方案。

使用 contenteditable 的解決方案

contenteditable 屬性可讓 HTML 元素編輯，而無需轉換為表單元素。這允許您使用 HTML 和 CSS 來設定元素內文字的樣式，包括指派不同的顏色。

範例程式碼

<div>

說明

1. 建立一個id 為「mymy」的div設定contenteditable 屬性設定為“true”。
2. 在 div 內，使用 ;元素來包裹要著色的文字。
3. 使用 CSS 將不同的顏色樣式套用於 span 元素。

結果

上面的程式碼將建立一個可由使用者編輯的 div 元素。文字「Bob」將以藍色顯示，文字「Joe」將以綠色顯示。用戶還可以根據需要編輯或刪除文字並更改顏色。

注意：

此解決方案依賴 HTML 和 CSS，可能無法與所有版本相容瀏覽器或裝置。如果您需要更強大的解決方案，請考慮使用第三方程式庫或實作自訂 JavaScript 解決方案。

以上是如何在文字區域顯示多色文字？的詳細內容。更多資訊請關注PHP中文網其他相關文章！