Search code examples
cssfontswebfontstypographyfont-family

How to choose font different font-weight? use bolder one or just font-weight?


[Before we start] I'm a Chinese user, and there are so many different weights of Chinese font. They are in the same font-family, but they didn't stay together like latin fonts, e.g., Huakang Chaohei(~Black) and Huakang Cuhei(~Bold).For that, I have to choose different font-family, rather than font-weight.

So this question happens so frequently to me when choosing different font-weight and font-family.


Just like the following picture, can I use font-family: "helvetica bold" in CSS? Or, use font-family: helvetica; font-weight: 600 to specify the bolder version of helvetica?

font-family example of helvetica(regular, light, bold)

UPDATE:

Thanks all. So how to do with the name different than bold?

font-family of tahoma


Solution

  • You would use the latter, like this:

    font-family: helvetica; 
    font-weight: bold;
    

    or you can use this:

      font-weight: bold;
    

    Note, you likely should include more fonts, as not all browsers will render helvetica, so you could use something like this:

    font-family: Helvetica,Arial,sans-serif;
    

    Edit to match the above edit:

    he values you can use are normal (which is the default weight), bold, bolder, lighter. You can also use the values from 100 to 900, the higher being bolder. You can also use initial and inherit.

    Note font-weight should work fine with Chinese; the fonts themselves are the ones you need to pay attention to.