Here's a tiny sample of an embedded font experiment of mine:
Code:
<h1>Capitulum I</h1>
<p><span class="courgette">Ea res est Helvetiis per</span> — courgette indicium
enuntiata. Moribus suis Orgetoricem ex vinculis causam dicere coegerunt; damnatum
poenam sequi oportebat, ut igni cremaretur.</p>
And the css for that courgette class is:
Code:
@font-face {
font-family: Courgette-Regular;
font-weight: normal;
font-style: normal;
src:url(../Fonts/Courgette-Regular.otf);
}
.courgette {
font-family: "Courgette-Regular", sans-serif;
}
That works great.
As far as I can tell the e-reader I'm using, the Kobo Forma, doesn't let me change the base font, the one you get from specifying serif or sans-serif (or not specifying anything), when you use embedded fonts in its font settings. Its font setting choices are Publisher Default, which is what you use when the book has embedded fonts, or one of the built in fonts, Caecilia, Georgia, etc. If I don't specify a font for everything else then I get a font with pointy serifs, Georgia perhaps, but I would prefer a font with more slab like serifs. What I put in my css file is
Code:
html {
font-family: "Bitter-Regular", serif;
}
strong, b {
font-family: "Bitter-Bold", serif;
}
em, i {
font-family: "Bitter-Italic", serif;
}
h1, h2, h3 {
font-family: "Bitter-Bold", serif;
font-weight: bold;
text-align: center;
margin-bottom: 2rem;
}
Is this the normal way to change the "default" font when you're using embedded fonts?