Note that there are some explanatory texts on larger screens.

plurals
  1. POHow can I use one font face for normal weight and another for bold on the body?
    primarykey
    data
    text
    <p>I am trying to apply the font 'open sans' to my website. I would like to use the 'open sans regular' for text that isn't bold and the 'open sans bold' font for text that is bold, 'open sans italic' for italic text, and finally 'open sans bold italic' for text that is bold and italic. I don't want to set a class but rather just have them apply to the entire website.</p> <p>Here is the code that I have tried, but it is just applying 'open sans italic' and i think 'open sans bold italic' to everything even when it shouldn't be italic..</p> <pre><code>@font-face { font-family: 'opensans'; src: url('opensans-regular-webfont.eot'); src: url('opensans-regular-webfont.eot?#iefix') format('embedded-opentype'), url('opensans-regular-webfont.woff') format('woff'), url('opensans-regular-webfont.ttf') format('truetype'), url('opensans-regular-webfont.svg#open_sansregular') format('svg'); font-weight: normal; font-style: normal; } @font-face { font-family: 'opensans'; src: url('opensans-semibold-webfont.eot'); src: url('opensans-semibold-webfont.eot?#iefix') format('embedded-opentype'), url('opensans-semibold-webfont.woff') format('woff'), url('opensans-semibold-webfont.ttf') format('truetype'), url('opensans-semibold-webfont.svg#open_sanssemibold') format('svg'); font-weight: bold; } @font-face { font-family: 'opensans'; src: url('opensans-italic-webfont.eot'); src: url('opensans-italic-webfont.eot?#iefix') format('embedded-opentype'), url('opensans-italic-webfont.woff') format('woff'), url('opensans-italic-webfont.ttf') format('truetype'), url('opensans-italic-webfont.svg#open_sansitalic') format('svg'); font-style: italic, oblique; } @font-face { font-family: 'opensans'; src: url('opensans-semibolditalic-webfont.eot'); src: url('opensans-semibolditalic-webfont.eot?#iefix') format('embedded-opentype'), url('opensans-semibolditalic-webfont.woff') format('woff'), url('opensans-semibolditalic-webfont.ttf') format('truetype'), url('opensans-semibolditalic-webfont.svg#open_sanssemibold_italic') format('svg'); font-weight: bold; font-style: italic, oblique; } body { font-family:'opensans'; font-size:78%; } </code></pre> <p>Here is an example of the issue, notice all font is italic when it shouldn't be: <a href="http://www.bbmthemes.com/themes/modular/" rel="nofollow">http://www.bbmthemes.com/themes/modular/</a></p>
    singulars
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload