2

The question is pretty straightforward.

I use Bootstrap, where all the bold things are CSSized in 

tag {
  font-weight: bold;
}

but I use Open Sans (as so many people), where font-weight: 400 is not enough and font-weight: 700 is much better.

Is there a way I tell my CSS that bold=700 and not 400 (which is I reckon the default value) ?

=====

EDIT

I must have been unclear.

In CSS only, without modifying Bootstrap sources, there are many locations (the whole list here) where bootstrap says (Eg.)

h6 {
  font-weight: bold
}

I'd like the web-browser to understand that in this case bold should be equivalent to font-weight: 700 instead of font-weight: 400 as per default without rewriting all the rules (Eg.)

h6 {
  font-weight: 700
}

The answer can be that it is not currently possible, but Google hasn't provided me any answer yet.

Augustin Riedinger
  • 20,909
  • 29
  • 133
  • 206
  • 4
    Why not just do `font-weight: 700`? Or do you want to use `bold` as a shortcut (alias) for `700`? In the latter case, if you're using LESS this is pretty easy; you can just do `@bold-weight: 700` and then `tag { font-weight: @bold-weight; }` – Bojangles Aug 22 '13 at 12:03
  • That's pretty much what I want to do, but - if possible - in CSS instead of LESS (since I'd like to keep Bootstrap source unchanged). – Augustin Riedinger Aug 22 '13 at 14:19
  • Does this answer your question? [Is it possible to make font-weight: bold equal to 500 instead of 700?](https://stackoverflow.com/questions/37836290/is-it-possible-to-make-font-weight-bold-equal-to-500-instead-of-700) – Clément Mar 21 '22 at 08:00

2 Answers2

5

if you are using the strong tag.

strong {
    font-weight: 700;
}

or if you are making elements bold using font-weight:bold, why not

elem {
    font-weight: 700;
}

Note: As @Pavlo pointed out, bold is equivalent to 700.

Kami
  • 19,134
  • 4
  • 51
  • 63
  • 2
    Actually `bold` is equivalent to `700`: https://developer.mozilla.org/en-US/docs/Web/CSS/font-weight#Values – Pavlo Aug 22 '13 at 12:23
3

If you are using Open Sans, i would guess you are using @fontface - It's not advisable to set font-weight's using the font-weight property while using @fontface unless from something like Typekit. If your hosting your own fonts, i think adding font-weight will try and add a weight on a font that only has one weight.

Open sans i often use and i know comes in several weights all of which you reference in your style separately and call depending on what you need. So you would simply reference the opensans-bold or whichever weight you wanted.

However using fonts from google etc, i think font weights do work.

A good article here

Gerico
  • 5,079
  • 14
  • 44
  • 85
  • +1, only answer to the point. Why not @font-face? It seems to be anyway the only thing to try, by pointing to different versions of the typeface: see http://stackoverflow.com/a/2436830/931156 and http://www.metaltoad.com/blog/how-use-font-face-avoid-faux-italic-and-bold-browser-styles – lajarre Aug 26 '13 at 20:55