不同系统、平台的字体并不统一,在不同的平台上显示效果也不一样。 修改Hexo博客的字体,取一个自己喜欢的折中效果。

现在使用的主题是next,修改字体样式的文件路径是: themes/next/source/css/_variables/base.styl

Mac上怎么调整都不会难看,Windows和安卓上怎么调都感觉不好看。应该是显示效果的差距摆在那里,苹果屏幕素质实在太优秀。试了挺多个字体和大小。最终取折中的结果,配置内容主要修改如下:

// Font families.
$font-family-chinese      = Arial, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "WenQuanYi Micro Hei";

$font-family-base         = $font-family-chinese, sans-serif
// $font-family-base         = get_font_family('global'), $font-family-chinese, sans-serif if get_font_family('global')

$font-family-logo         = $font-family-base
$font-family-logo         = get_font_family('logo'), $font-family-base if get_font_family('logo')

$font-family-headings     = $font-family-base
// $font-family-headings     = get_font_family('headings'), $font-family-base if get_font_family('headings')

$font-family-posts        = $font-family-base
// $font-family-posts        = get_font_family('posts'), $font-family-base if get_font_family('posts')

$font-family-monospace    = Menlo, consolas, $font-family-chinese, monospace
// $font-family-monospace    = get_font_family('codes'), Menlo, consolas, $font-family-chinese, monospace if get_font_family('codes')

$font-family-icons        = 'FontAwesome'

$font-size-base           = 16px
$table-font-size          = 15px
$font-size-headings-base  = 22px
$code-font-size           = 14px
$line-height-code-block   = 1.6