CSS @font-face 'te sadece bir karakterin gösterilmesini engellemek
@font-face'in içinde bulunan unicode-range ile belirli aralıktaki karakterleri görüntüleyebiliyoruz. Fakat ben sadece " " yani boşluk karakterinin gösterilmemesini istiyorum. "Noto Color Emoji" boşlukları abartıyor :)
Bu nasıl mümkün olabilir?
> Not: Tampermonkey ile JS kullanarak bu işlemi yapıyorum. Tüm kodlarım aşağıda:
let style=`
@font-face {
font-family: NotoColorEmojiLimited;
unicode-range: U+00000-99999;
src: url(https://raw.githack.com/googlefonts/noto-emoji/main/fonts/NotoColorEmoji.ttf);
font-display: swap;
}
`
let s;
document.head.append(s=document.createElement('style'))
s.innerHTML=style
for(let sheet of document.styleSheets){
try{
for(let rule of sheet.cssRules){
try {
if(rule.style.fontFamily.length>0){
rule.style.fontFamily='NotoColorEmojiLimited,'+rule.style.fontFamily
}
} catch (error) {
}
}
}catch(error){}
}
Şimdiden teşekkürler!
Soru hatalı mı? 👎
Eğer sorunun kurallara aykırı olduğunu düşünüyorsanız lütfen bize bildirin!
Cevaplar (2)
Kodunuzu şu şekilde güncelledim:
let style = `
@font-face {
font-family: NotoColorEmojiLimited;
unicode-range: U+0000-001F U+0021-99999;
src: url(https://raw.githack.com/googlefonts/noto-emoji/main/fonts/NotoColorEmoji.ttf);
font-display: swap;
}
`;
let s;
document.head.append(s = document.createElement('style'));
s.innerHTML = style;
for (let sheet of document.styleSheets) {
try {
for (let rule of sheet.cssRules) {
try {
if (rule.style.fontFamily.length > 0) {
rule.style.fontFamily = 'NotoColorEmojiLimited,' + rule.style.fontFamily;
}
} catch (error) {}
}
} catch (error) {}
}
Güncellenen kodda, unicode-range özelliğini U+0000-001F aralığını ekleyerek boşluk karakterinin (U+0020) dışarıda bırakıldığını göreceksin. Böylece sadece boşluk karakteri dışındaki diğer karakterler "Noto Color Emoji" yazı tipi tarafından gösterilecektir.