Browser font weight not working

Mar 22, 2023#front #vitepress401

AI Translation

This post is translated from Chinese into English through AI.View Original

AI-generated summary

The issue described is about the font-weight not working in the Vitepress theme when compared to Hugo. After investigating the issue, it was found that the problem lies in the font-synthesis property, which needs to be changed to "weight" in order to resolve the issue.

Recently, I have been studying the theme of vitepress and I am planning to switch my blog from hugo to vitepress (because the code blocks in vitepress look better than those in hugo).

When writing the theme, I found that the custom font setting font-weight I added does not take effect, but it works in hugo.

Finally, I tried one style after another using F12, and found that vitepress's body has the following styles:

text-rendering: optimizeLegibility;
direction: ltr;
font-synthesis: style;
-webkit-font-smoothing: antialiased;

The problem lies in font-synthesis: style;, which should be changed to weight.