Google Chrome 扩展程序允许更改所选文本的字体

Google Chrome 扩展程序允许更改所选文本的字体

我一直在寻找在阅读一些编程博客时遇到的一个小麻烦,这些博客在文章中发布的源代码与常规文本的字体相同。这个问题的唯一例外是整篇文章都使用等宽字体。

此类编程博客文章的截图:

代码

通过在纯文本模式下通过 Google 的网络缓存查看文章,我发现情况有所缓解,并且文章以等宽字体显示,因为我已将浏览器的默认字体设置为等宽字体。

我真正想要的是能够从网络文章中选择源代码并通过扩展来更改字体,就像在文字处理程序中一样。

通过使用 Google Chrome Inspect element,我改变了:

<span class="code">
    <p>&nbsp;&nbsp;&nbsp; try<br minmax_bound="true">&nbsp;&nbsp;&nbsp; ...</p>
</span>

到:

<span class="code" style="font-family:monospaced;">
    <p>&nbsp;&nbsp;&nbsp; try<br minmax_bound="true">&nbsp;&nbsp;&nbsp; ...</p>
</span>

如果这是一大段代码,则重复上述操作有点牵强,如果文章中有多个代码片段,我发现这是不可行的。我尝试了很多次,寻找可以让用户选择一些文本并更改其字体的 Chrome 浏览器扩展,但都没有成功。

您是否知道这样的扩展或替代/更简单的解决方案?提前致谢。

PS 我不太了解为 Chrome 开发浏览器扩展,也不知道浏览器是否公开了这样的功能。闲暇时我也想探索这条路线。这可以成为我接触编程扩展的好机会。同时,如果社区有任何新的想法/想法,我将不胜感激。

编辑 #1:我正在寻找一种无需重新加载页面即可更改字体的解决方案。因为在某些情况下,内容可能会在页面刷新后发生变化。查看编程博客中的源代码只是我最常遇到的一种情况。例如,一篇网络文章可能包含一些 ASCII 艺术设计,但原作者在文章的主要可变宽度字体中呈现。我知道,我可以简单地复制 ASCII 艺术部分(甚至是编程博客中的源代码)并在记事本中查看它。我开始怀疑我是否只是过于担心一个微不足道的需求。

答案1

为什么不直接使用 Google 的 Custom.css,它位于“默认”文件夹 > 用户样式表 > Custom.css。

Google 的 custom.css 文件将覆盖网页上的任何 css,并且它允许您使用 CSS 指定任何内容。

答案2

根据 MarcusJ 在评论中的建议回复,我尝试了时髦的Chrome 的扩展程序。它完成了工作。它要求我手动输入 CSS 代码并分配 URL 匹配模式。但是,我发现扩展程序风格机器人使用起来更方便。Stylebot 提供了一个易于使用的界面来选择 HTML 元素并进行样式更改。Stylebot 将样式规则应用于该子域中的所有页面。我喜欢 Stylebot 在后台为您完成这项工作。

相关内容