Màu chữ khác nhau cho dấu trọng âm trong Unicode

8

Tôi đang làm việc trên một ứng dụng sử dụng một số tập lệnh tiếng Thái. Nhiều nguyên âm trong chữ viết tiếng Thái được viết là những gì tốt nhất có thể được mô tả là dấu trọng âm trên phụ âm.

Ví dụ: trong từ: กึ

Và đều là phụ âm, nhưng là nguyên âm. Tôi cần có thể đặt nguyên âm thành một màu khác với phụ âm, nhưng tôi không biết liệu điều này có khả thi trong HTML hay không vì tôi không thể chọn nguyên âm độc lập với phụ âm.

Tôi chắc chắn điều này áp dụng cho các tình huống khác cũng như cho các điểm nhấn, nhưng tôi không thể tìm thấy bất kỳ giải pháp nào.

typography

— JohnGB
nguồn

Nếu điều này là cho mục đích minh họa, thay vì cho mỗi lần xuất hiện trong một văn bản tùy ý, bạn có thể xem xét một hình hoặc minh họa. Bạn có thể thử một đồ họa nội tuyến (với văn bản thay thế là hai glyphs).

— horatio

9

Câu trả lời ngắn: nó sẽ không hoạt động. Hơn nữa với những gì e100 đã nói, bạn có thể thử một vài cách khác nhau, nhưng không có cách nào đạt được hiệu quả mong muốn.

Dưới đây là tiêu chuẩn "hãy kết xuất dưới dạng thực thể HTML và xem trình duyệt kết hợp văn bản mẫu glyphs":
Hãy thử thay đổi màu sắc cho nguyên âm. IE9 kết xuất các ký tự được kết hợp, nhưng sử dụng màu của ký tự đầu tiên. Thật thú vị khi lưu ý rằng khi chúng tôi làm điều này trong Chrome (và tôi cũng giả sử Safari, vì nó dựa trên WebKit) - các ký tự không được kết hợp. Chrome biểu hiện nguyên âm dưới dạng một ký tự rời rạc, có thể là do nhịp này phá vỡ công cụ phân tích cú pháp ký tự của nó.
Chúng ta có thể thử và điều chỉnh thủ công nguyên âm để đặt nó ở vị trí cần thiết, nhưng thật không may, glyph biểu hiện với "ký tự ma" ở phía dưới và điều này có vẻ không ổn.
Chúng ta có thể cố gắng để thực sự xảo quyệt và không chia rẽ các nhân vật. Chúng ta sẽ sử dụng một SPANký tự xung quanh cả hai ký tự nhưng sử dụng :first-letterbộ chọn phần tử giả của CSS ... chỉ để thấy rằng nó luôn hiển thị dưới dạng màu của ký tự đầu tiên. Hành vi này giống nhau trong WebKit và Trident.

Hãy nhớ rằng cả Presto và Gecko đều không thể làm điều này. Trên thực tế, Gecko thậm chí còn tệ hơn trong nỗ lực "vị trí tương đối" của chúng tôi khi nó kết hợp các ký tự và sau đó thu gọn lề để cả hai phụ âm va chạm vào nhau. Điều đó khá nhiều bao gồm tất cả các trình duyệt chính của bạn ... bummer.

— Trò hề
nguồn

That's a Class-A answer, Farray. You just saved me several hours of wasted effort (different scenario, same idea).

— Alan Gilbertson

1

I don't have an answer but this test case demonstrates the problem, comparing it to a similar treatment of Latin characters.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">

<html>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
</head>

<body>
    <div>&#x0E01;<span style='color: red'>&#x0E36;</span>&#x0E14;</div>
    <div>&#x0E01;
        <span style='color: red'>&#x0E36;</span>
&#x0E14;
    </div>
    <div>x<span style='color: red;'>o</span>x</div>
    <div>x
        <span style='color: red;'>o</span>
x
    </div>
</body>
</html>

I get different results in IE8 and Chrome - neither work as you would like. This may come down to browser implementation. Perhaps someone else can build on this.

— e100
nguồn