CSS @font-face 'te sadece bir karakterin gösterilmesini engellemek

arduinoturkbatu 337 gün önce

234 defa görüntülendi ve 1 kişi tarafından değerlendirildi

@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!

Spam olarak işaretle

Cevaplar (2)

f4kor4ll

326 gün önce

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.

#012616

arduinoturkbatu

324 gün önce

Çok teşekkür ederim, kod çok yardımcı oldu.

#012624