Javascript Prism.js覆盖字体系列CSS

我正在使用prism.js语法强调我一直在写的关于three.js的一系列文章中的代码。很好用，但不管我做什么，我似乎都无法覆盖字体系列。代码总是在Courier中呈现。我不喜欢信使-太重，难以阅读（国际海事组织）

我创建了一个JSFIDLE来演示这一点

<script src="https://cdnjs.cloudflare.com/ajax/libs/prism/1.6.0/prism.js"> </script>
<style>
    pre {  
       font-size: 90%;
       font-family: "Lucida Sans Typewriter", "Lucida Console", Monaco, monospace; 
}
</style>

前{
字体大小：90%；
字体系列：“Lucida Sans打字机”，“Lucida控制台”，摩纳哥，monospace；
}

var gfxScene=新的GFX.Scene（{ cameraPos:[-13,10,30]， 阿尔法缓冲区：对， 默认灯光：false， 控制：对， clearColor:0x4444aa， shadowMapEnabled:true， displayStats：真 });

---

看起来prism.js故意覆盖了字体系列规范，但也许我遗漏了一些东西。（这以前发生过；-）

Courier是单空格字体。我最好的猜测是你的浏览器使用Courier作为你的单空间字体，这是真的，但问题是为什么浏览器会“倒退”呢？Lucida Sans打字机可以在我的系统上使用，如果我在Chrome中选择它作为我的“默认”单空格字体，它就可以正常工作。但是，如果我将Courier作为我的“默认”字体，那么即使我的CSS另有说明，也会使用Courier。字体选择在正文中有效，但在prism.js选择器代码中无效。这对我来说似乎是一个错误。如果我正确理解CSS选择器规则（浏览器可能不遵守），选择器应该覆盖“默认”字体。你能使用吗！在CSS属性中很重要，或者可能在标记中包含

style=font-family

？添加！重要帮助：字体系列：“Lucida Sans打字机”，“Lucida控制台”，摩纳哥，monospace！重要的； var gfxScene = new GFX.Scene( { cameraPos : [-13, 10, 30], alphaBuffer: true, defaultLights: false, controls:true, clearColor:0x4444aa, shadowMapEnabled:true, displayStats: true });