Nodejs 把论坛字体一律换成等宽字体怎么样?

Nodejs 把论坛字体一律换成等宽字体怎么样?

当然细节还要调整下… 用这行代码看下 Demo:

$('*').css('font-family', 'momaco, consolas, monospace, "wenquanyi microhei", "microsoft yahei"')

全是等宽字体的话, 贴 Log 和代码随意一些也无所谓了, 不会显得太乱,

相对来说, 中文本来就变相等宽的… 英文字体大部分代码本来就用等宽, 一些非代码的英文字符会显得有些古怪, 当然, 相对比较少的, 办法简单粗暴, 不知道感觉上能不能接受?


5 回复

Nodejs 把论坛字体一律换成等宽字体怎么样?

把论坛中的所有字体统一换成等宽字体可以提升代码和日志展示的可读性。对于程序员来说，这不仅使页面看起来更加专业，还能提高阅读体验。但需要注意的是，这种方法可能会让部分非代码文本显得不太自然，特别是英文文本。

以下是一个简单的实现方法：

示例代码

首先，你需要确保你的前端页面能够加载到这段JavaScript代码。你可以在HTML文件的<head>部分或者页面加载完成后执行这段代码。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>论坛字体统一为等宽字体</title>
    <script>
        document.addEventListener("DOMContentLoaded", function() {
            // 将所有元素的字体设置为等宽字体
            $('*').css('font-family', 'monaco, consolas, monospace, "wenquanyi microhei", "microsoft yahei"');
        });
    </script>
</head>
<body>
    <!-- 论坛内容 -->
</body>
</html>

解释

  1. 选择器：$('*')选择器用于选择页面上的所有元素。
  2. CSS属性：.css('font-family', '...') 方法用于设置所有元素的字体族。
  3. 字体列表：'monaco, consolas, monospace, "wenquanyi microhei", "microsoft yahei"' 列出了多种等宽字体，以确保在不同系统中都能找到合适的字体。monaco 和 consolas 是常见的等宽字体，monospace 是一个通用的等宽字体名称，"wenquanyi microhei" 和 "microsoft yahei" 是中文等宽字体。

注意事项

  • 兼容性：不同的操作系统和浏览器可能支持不同的字体，因此建议使用多个字体名来确保兼容性。
  • 用户体验：虽然等宽字体对代码展示有利，但对于非代码文本可能会显得不自然，因此需要权衡利弊。

总体来说，将论坛字体统一为等宽字体是一个有效的方法来提升代码展示的可读性和专业性，但也需要注意潜在的用户体验问题。


我觉得还不如在编辑框附近高亮显示如何编写代码块 markdown, 以及在提交之前强制预览 (比如预览状态下才有提交按钮).

的确没有 Markdown 手动做的标记, 格式反正就乱掉了的

我觉得代码,能支持插入gist 就方便了…

如果你希望将论坛中的所有文本都显示为等宽字体，可以使用上述方法通过修改CSS来实现。这种方法简单直接，但可能会影响到整个网站的视觉一致性。以下是一段JavaScript代码，用于将所有元素的字体更改为等宽字体：

// 使用jQuery选择器来改变所有元素的字体
$('body *').css('font-family', 'monaco, consolas, monospace, "Microsoft YaHei", "WenQuanYi Micro Hei"');

// 如果不使用jQuery，可以用纯JavaScript实现：
Array.from(document.body.getElementsByTagName('*')).forEach(el => {
    el.style.fontFamily = 'monaco, consolas, monospace, "Microsoft YaHei", "WenQuanYi Micro Hei"';
});

解释

  • monaco, consolas, monospace 是一些常用的等宽字体，优先级从左到右。
  • "Microsoft YaHei" 和 "WenQuanYi Micro Hei" 是中文等宽字体，用来确保中文内容也能以等宽形式显示。

注意事项

  • 这种方法会更改整个页面的字体设置，可能会影响到页面的整体视觉风格。
  • 等宽字体通常更适合于编程相关的文本，如果网站包含大量非编程文本，则可能会显得不太协调。
  • 如果你的目标是仅更改特定部分（例如代码块），那么建议你通过CSS类或者HTML标签来更精确地应用样式。

你可以根据需要调整字体列表，确保它能够适应不同用户的浏览器环境。

回到顶部