Birincil endişeniz tek renkli ekranı zorlamaksa, böylece emoji metinden çok fazla öne çıkmazsa, CSS filtreleri, tek başına veya Unicode varyasyon seçiciyle birlikte istediğiniz bir şey olabilir.
p.gscale {
-webkit-filter: grayscale(100%);
filter: grayscale(100%);
}
a {
color: #999;
-webkit-filter: grayscale(100%) sepia(100%) saturate(400%) hue-rotate(170deg);
filter: grayscale(100%) sepia(100%) saturate(400%) hue-rotate(170deg);
}
<p class="gscale">You've now got emoji display on 🔒lockdown🔒.</p>
<p>External Link: <a href="https://knowyourmeme.com/memes/party-hard">celebrate 🎉</a></p>
Varyasyon seçicinin aksine, emojinin nasıl oluşturulduğu önemli olmamalıdır, çünkü CSS filtreleri her şeye uygulanır. (Bunları, Wayback Makinesini işaret edecek şekilde değiştirilmiş köprülerdeki PNG biçimli "bağlantı türü" simgelerini gri tonlamalı olarak kullanıyorum.)
Sadece uyarıya dikkat et . Bir alt öğedeki ana öğenin filtresini geçersiz kılamazsınız, bu nedenle bu teknik bir paragrafı gri tonlamak ve ardından içindeki bağlantıları yeniden renklendirmek için kullanılamaz. 😢
... yine de, her şeyi bir köprü haline getireceğiniz veya içindeki zengin işaretlemeye izin vermeyeceğiniz durumlar için kullanışlıdır. (ör. başlıklar ve açıklamalar)
Ancak, CSS gerçekten uygulanmadıkça bu işe yaramayacaktır, bu yüzden daha güvenilir olan ikinci bir seçenek vereceğim. <title> Unicode varyasyon seçiciden (sana bakıyorum GitHub. tarayıcı sekmeleri):
Kullanıcı tarafından sağlanan bir dizeyi bir <title>öğeye koyuyorsanız , herhangi bir kalın / italik / altı çizili / vb. İle birlikte emojiyi filtreleyin. işaretleme. (Evet, gözden kaçıranlar için standart, " <title>ve işareti kaçışlarının yanı sıra düz metin olmasını ister ve test ettiğim tarayıcılar, içindeki tüm etiketleri değişmez metin olarak yorumlar.)
Düşünebileceğim iki yol:
- Doğrudan , Unicode'un en yeni sürümünün emojisini ve değiştiricilerini koyduğu bloklarla eşleşen, manuel olarak tutulan bir normal ifade kullanın .
- Grapheme kümeleri arasında yineleyin ve tanınan emoji kod noktalarını içerenleri atın . (Bir grafem kümesi, bir temel glif artı görünür karakteri oluşturan tüm aksan işaretleri ve diğer değiştiricilerdir. Bağlandığım örnek, belirtmek için Python'un normal ifade motorunu ve ardından
emojiveritabanı paketini kullanır, ancak Rust, bir dil için iyi bir örnektir. burada yinelenen grafem kümeleri gibi bir sandık aracılığıyla hızlı ve kolaydır unicode-segmentation.)
