无法将字体设为Noto Serif显示

HatCupCoke commented 5 years ago

我用过如下两种方法，但显示效果为只有英文和阿拉伯数字可以以Noto Serif来渲染，而中文不行。

第一种方法

    font-family: Noto Serif;
    font-style: normal;
    font-weight: 600;
    src: local('Noto Serif SC Regular'), url('vue/NotoSerifSC-Regular.otf') format('otf');
}
```body {
    font-family: Source Sans Pro, Helvetica Neue, Arial, sans-serif !important;
    color: #34495e;
    -webkit-font-smoothing: antialiased;
    line-height: 1.6rem;
    letter-spacing: 0;
    margin: 0;
    overflow-x: hidden;
}

第二种方法：将所有引用了本地Source Sans Pro的本地地址改为Noto Serif 的本地地址，如：

@font-face {
    font-family: 'Source Sans Pro';
    font-style: normal;
    font-weight: 600;
    src: local('Source Sans Pro SemiBold'), local('SourceSansPro-SemiBold'), url('vue/NotoSerifSC-SemiBold.otf') format('otf');
    /* src: local('Source Sans Pro SemiBold'), local('SourceSansPro-SemiBold'), url('vue/6xKydSBYKcSV-LCoeQqfX1RYOo3i54rwmRduz8A.woff2') format('woff2'); */
    unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

blinkfox commented 5 years ago

@ZongchengMa 我试了下，可以的。

我在这里下载了 NotoSerifSC-Regular.otf 字体，放在了主题的 vue 文件夹中，将这个字体也在本地电脑中安装了，然后在 vue.css 里面添加下面的 css

@font-face {
    font-family: 'Noto Serif SC';
    font-style: normal;
    font-weight: 300;
    src: local('Noto Serif SC'), local('Noto Serif SC Regular'), url('vue/NotoSerifSC-Regular.otf') format('otf');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

修改 body 中的 font-family ，添加字体:

body {
    font-family: Noto Serif SC, Source Sans Pro, Helvetica Neue, Arial, sans-serif !important;
    color: #34495e;
    -webkit-font-smoothing: antialiased;
    line-height: 1.6rem;
    letter-spacing: 0;
    margin: 0;
    overflow-x: hidden;
}

重启 Typora 就可以看到一个效果了，这个只是Regular风格的，同理你还得加其他几种风格的字体。

HatCupCoke commented 5 years ago

Snipaste_2019-04-13_17-36-06

依然如之前一样，显示效果为只有英文和阿拉伯数字可以以 Noto Serif 来渲染。

我认真比对了代码，发觉我的代码应该和你的一样，为防错漏，还是贴上来看看。

这是我的 CSS 文件。

blinkfox commented 5 years ago

我这边把你的css文件下载下来，本地试了下，没问题啊，切换字体，能看到一些中文的差别的

HatCupCoke commented 5 years ago

我又在我的台式机和笔记本都做了测试。结果依然是英文数字可以正常显示而中文字体无法显示为 Noto Serif，暂不清楚这个 bug 是如何产生的。

另外，我已确保我的 Typora 为最新的 0.9.68 版本。

995387611 commented 1 month ago

因为 Noto Sans 只有英文字符，需要下SC版本

blinkfox / typora-vue-theme

无法将字体设为Noto Serif显示 #19