Quote:
Originally Posted by Bozana
I'm having some difficulties. I haven't touched Sigil for embedding fonts for a long while and I sorta forgotten how. I have a stack of fonts added to the files in Sigil and saved them in the file:
Bookman Old Style Bold Italic.ttf
Bookman Old Style Bold.ttf
Bookman Old Style Italic.ttf
Bookman Old Style.ttf
Times New Roman Bold Italic.ttf
Times New Roman Bold.ttf
Times New Roman Italic.ttf
Times New Roman.ttf
And I've declared them in the page_styles.css:
@font-face {
font-family: 'Bookman Old Style';
src: url(../Fonts/Bookman Old Style.ttf);
}
@font-face {
src: url(../Fonts/Bookman Old Style Bold.ttf);
font-family: "Bookman Old Style Bold";
font-weight: bold;
}
@font-face {
src: url(../Fonts/Bookman Old Style Italic.ttf);
font-family: "Bookman Old Style Italic";
font-style: italic;
}
@font-face {
src: url(../Fonts/Bookman Old Style Bold Italic.ttf);
font-family: "Bookman Old Style Bold Italic";
font-weight: bold;
font-style: italic;
}
@font-face {
src: url(../Fonts/Times New Roman.ttf);
font-family: "Times New Roman"
}
@font-face {
src: url(../Fonts/Times New Roman Bold.ttf);
font-family: "Times New Roman Bold";
font-weight: bold;
}
@font-face {
src: url(../Fonts/Times New Roman Italic.ttf);
font-family: "Times New Roman Italic";
font-style: italic;
}
@font-face {
src: url(../Fonts/Times New Roman Bold Italic.ttf);
font-family: "Times New Roman Bold Italic";
font-weight: bold;
font-style: italic;
}
And in the stylesheet.css:
.BodyText { // Body of the book
font-family: "Times New Roman", "serif";
font-style: normal;
font-variant: normal;
font-weight: normal;
letter-spacing: 0;
position: relative;
text-decoration: none;
text-line-through: none;
top: 0
}
span.DrioCapIta { //Drop Caps for first letter of a paragraph but with italic
font-family: "Bookman Old Style Bold Italic", "serif";
font-style: italic;
font-weight: bold;
float: left;
font-size: 3em;
line-height: 0.8em;
margin-right: 3pt;
margin-bottom: -0.1em;
}
span.DropCap { //Drop Caps for first letter of a paragraph
font-family: "Bookman Old Style Bold", "serif";
font-weight: bold;
float: left;
font-size: 34pt;
line-height: 0.8em;
margin-right: 2pt;
margin-bottom: -0.1em;
}
.Heading118pt { // 1 Smaller Heading
font-family: "Bookman Old Style Bold", "serif";
font-size: 1.41667em;
font-weight: bold;
letter-spacing: -1pt;
line-height: 1.2;
margin-bottom: 12pt;
margin-left: 0;
margin-right: 0;
margin-top: 50pt;
text-align: center
}
h1.h1 { // Nearly all Chapter Headings
font-family: "Bookman Old Style Bold", "serif";
font-size: 2em;
font-weight: bold;
font-style: normal;
font-variant: normal;
margin-bottom: 12pt;
margin-left: 0;
margin-right: 0;
margin-top: 50pt;
text-decoration: none;
text-align: center;
}
I'm wondering where I've gone wrong? Anyone could kindly help me with this please?
I can attached the epub I'm working on, if needed.
|
Try the following declarations:
Code:
@font-face {
font-family: "Bookman Old Style";
font-style: normal;
font-weight: normal;
src: url("../Fonts/Bookman Old Style.ttf");
}
@font-face {
font-family: "Bookman Old Style";
font-style: normal;
font-weight: bold;
src: url("../Fonts/Bookman Old Style Bold.ttf");
}
@font-face {
font-family: "Bookman Old Style";
font-weight: normal;
font-style: italic;
src: url("../Fonts/Bookman Old Style Italic.ttf");
}
@font-face {
font-family: "Bookman Old Style";
font-weight: bold;
font-style: italic;
src: url("../Fonts/Bookman Old Style Bold Italic.ttf");
}
@font-face {
font-family: "Times New Roman";
font-style: normal;
font-weight: normal;
src: url("../Fonts/Times New Roman.ttf");
}
@font-face {
font-family: "Times New Roman";
font-style: normal;
font-weight: bold;
src: url("../Fonts/Times New Roman Bold.ttf");
}
@font-face {
font-family: "Times New Roman";
font-style: italic;
font-weight: normal;
src: url("../Fonts/Times New Roman Italic.ttf");
}
@font-face {
font-family: "Times New Roman";
font-weight: bold;
font-style: italic;
src: url("../Fonts/Times New Roman Bold Italic.ttf");
}
Put all those declarations in your stylesheet.css and NOT in page_styles.css. Also, in the stylesheet.css write:
Code:
.BodyText {
font-family: "Times New Roman", serif;
font-style: normal;
font-variant: normal;
font-weight: normal;
letter-spacing: 0;
position: relative;
text-decoration: none;
text-line-through: none;
top: 0
}
span.DrioCapIta {
font-family: "Bookman Old Style", serif;
font-style: italic;
font-weight: bold;
float: left;
font-size: 3em;
line-height: 0.8em;
margin-right: 3pt;
margin-bottom: -0.1em;
}
span.DropCap {
font-family: "Bookman Old Style", serif;
font-weight: bold;
font-style: normal;
float: left;
font-size: 34pt;
line-height: 0.8em;
margin-right: 2pt;
margin-bottom: -0.1em;
}
.Heading118pt {
font-family: "Bookman Old Style", serif;
font-size: 1.41667em;
font-weight: bold;
font-style: normal;
letter-spacing: -1pt;
line-height: 1.2;
margin-bottom: 12pt;
margin-left: 0;
margin-right: 0;
margin-top: 50pt;
text-align: center
}
h1.h1 {
font-family: "Bookman Old Style", serif;
font-size: 2em;
font-weight: bold;
font-style: normal;
font-variant: normal;
margin-bottom: 12pt;
margin-left: 0;
margin-right: 0;
margin-top: 50pt;
text-decoration: none;
text-align: center;
}
Try that code that should work. Remember, all declarations in your stylesheet.css file.
Regards
Rubén