HTML định dạng chữ văn bản tiếng Ả Rập

Question

Tôi muốn tô màu một số chữ cái trong một văn bản tiếng Ả Rập, ví dụ văn bản này:

إذا ماطمحت إلى غاية

đó mang lại cho tôi văn bản bình thường này:

Vì vậy, tôi đặt một số chữ cái trong các thẻ để tô màu chúng:

HTML:

إذا <b>م</b>اط<b>م</b>حت إلى <b>غ</b>اية 

CSS:

b { 
    color: #e74c3c; 
} 

và điều này đã cho tôi:

Nhưng tôi muốn nó để cho một thể đọc văn bản tiếng Ả Rập bình thường như thế:

tôi đã cố gắng thay đổi phông chữ nhưng nó có vẻ là vấn đề tương tự với tất cả các phông chữ vì vậy vấn đề không phải là ở phông chữ.

Answer 1

Thử thêm zero-width joiner Unicode character trước thẻ mở. Bạn nên kiểm tra điều này trong tất cả các trình duyệt, vì nó là một vấn đề mà một số người không thể đối phó.

Answer 2

Tôi có một bài kiểm tra ở đây, nhưng tôi thấy vết cắt nhỏ giữa các chữ cái màu đỏ và lá thư sau đây:

إذا <b>م&zwj;</b>ا ط<b>م&zwj;</b>حت إلى <b>غ&zwj;</b>اية 

https://jsfiddle.net