Bir CSS dosyasında chrome.extension.getURL()
kullanamadığım için, yerel bir font dosyasıyla @ font-yüzünü nasıl kullanabilirim? İşteİçerik Komut Dosyası'nda bir Chrome Uzantısında @ font-face nasıl kullanılır?
cevap
css yerel yolunu almak için yapılması gerekenler: o here hakkında
body {
background-image:url('chrome-extension://[email protected]@extension_id__/background.png');
}
Daha.
Sadece ilgili bir URL kullanın. Bu basit, daha temiz ve ™ yapılacak doğru şey olduğunu:
@font-face {
font-family: 'FontAwesome';
src: url('../font/fontawesome-webfont.eot');
}
Bu soru eski olduğunu biliyorum ama Google'da üst bir sonuç ve kabul edilen cevap verimsizdir.
DÜZENLEME: Diğerleri bunun için karışık sonuçlar alıyor gibi görünüyor. İçerik Komut Dosyalarında kullanıldığında muhtemelen işe yaramadığını belirtmeliyim. Bunu Popup Script'lerinde test ettim ve gayet iyi çalışıyor.
Bunun işe yaradığından emin misin? Benim için değil. – Layke
@Layke Yol, CSS dosya konumuna göre değişir. Örneği sadeleştirdim, bu yüzden muhtemelen bir 'format()' belirtmeniz gerekecek. – matpie
Bu çalışmaz. Çalışmakta olan Gerçek Web Sayfası içerik komut dosyasına kaynak bulmaya çalışır. –
Bu çözüm nihayet benim için çalıştı:
Bu içerik script belgeye bir stil düğümü enjekte eder.
Ve Harika Yazı için, sadece Chrome için .woff src'ye ihtiyacınız vardır.
Adding @font-face stylesheet rules to chrome extension
Kodum:
var fa = document.createElement('style');
fa.type = 'text/css';
fa.textContent = '@font-face { font-family: FontAwesome; src: url("'
+ chrome.extension.getURL('lib/fa/fonts/fontawesome-webfont.woff?v=4.0.3')
+ '"); }';
document.head.appendChild(fa);
Bildiriminize olarak
:
"css":[
"lib/fa/css/font-awesome.min.css",
...
]
"web_accessible_resources":[
"lib/fa/fonts/*",
...
]
Not: '' css ': [...] '' content_scripts' içerisine girer: [...] ' – IvanRF
Eski soruya, ama sanırım bu en iyi çözümdür:
Firefox extension custom fonts
Bir chrome uzantısına işaret etmek yerine, chrome uzantıları için eşit olarak uygulanır çünkü CSS'de fontun base64 kodlu sürümünü ekliyorsunuz demektir.
- 1. Chrome uzantısında içerik komut dosyası kullanarak CSS nasıl enjekte edilir?
- 2. İçerik komut dosyasında Flowplayer işlevleri nasıl kullanılır?
- 3. Chrome uzantısında, içerik komut dosyaları iframe içinde etkilenemez mi? manifest.json dosyasında
- 4. Krom uzantısında içerik komut dosyası yükleme
- 5. document.execCommand ("copy"), chrome uzantımın içerik komut dosyasında neden çalışmıyor?
- 6. Bir Chrome Uzantısında NaCl Ekleme
- 7. Bir Chrome Uzantısında ses nasıl kaydedilir?
- 8. Chrome Uzantısında jQuery.getJSON Kullanımı
- 9. Bir klavye uygulama uzantısında UITextField nasıl kullanılır?
- 10. ajax telefonum neden Chrome uzantısında senkronize oluyor?
- 11. Google Chrome uzantısında senkronize çağrı
- 12. Bir Chrome Uzantısında SWF Nesnesi - API Kullanılamıyor
- 13. Chrome uzantısında arka plan sayfasındaki nesneye nasıl erişilir Chrome uzantısı
- 14. Chrome uzantımın açılır sayfasını uzantının içerik komut dosyasından nasıl açabilirim?
- 15. Chrome uzantısında tek bir HTML öğesinin ekran görüntüsü nasıl alınır?
- 16. Chrome Uzantısı: Bu içerik komut dosyasının önceden bir sekmede nasıl yüklendiğini nasıl tespit edilir?
- 17. Arka plan sayfası açılır-chrome uzantısında
- 18. Pano Kopyala/İçerik komut dosyasına yapıştır (Chrome Uzantısı)
- 19. java.util.zip dosyasında nasıl kullanılır?
- 20. setInterval çalışmıyor (yalnızca bir kez ateş) Google Chrome uzantısında
- 21. Chrome uzantısı içerik komut dosyası: click() ve async sonuçları
- 22. Google Chrome uzantısı "içerik" komut dosyaları kum havuzlu mu?
- 23. İçerik içerikli komut dosyalarında tetikleme yok Chrome uzantısı
- 24. Chrome Extension içerik komut dosyası, enjekte edildiği sayfanın DOM'sine erişmiyor
- 25. Arka plan.js'den içerik komut dosyalarındaki Chrome çağrısı işlevi
- 26. Chrome uzantısı - URL güncellemelerinde içerik komut dosyasını yükle
- 27. Chrome uzantısı: İçerik komut dosyası ile background.html arasındaki iletişim
- 28. Web sayfası js'yi chrome uzantısı içerik komut dosyasından yürütme
- 29. Geçerli sekme url'yi arka plan komut dosyasında chrome uzantısına getir
- 30. Neden panelin Firefox Addon SDK içerik komut dosyasında hata alıyorum?
Bazı Chrome sürümlerinde, çalışmasını engelleyen bir hata var. Hızlı düzeltme: "__MSG _ @@ extension_id__" yerine sabit kodunuzu kullanın. Bummer, yerel olarak test ederken işe yaramayacak. –
https://developer.chrome.com/dev/extensions/manifest.html#web_accessible_resources adresine yazı tipi eklemeyi unutmayın! –