10-20-2012, 02:14 PM | #1 |
Member
Posts: 18
Karma: 10
Join Date: Jun 2012
Device: kindle fire,android
|
working with fonts in css
Whats the difference in using quotes and apostrophe?
@font-face { font-family:font family; example:"font family" or 'font family' font-style: normal; font-weight: normal; src: url(fonts/font family.ttc); example: "fonts/font family.ttc" or 'fonts/font family.ttc' } and the div? div.your div { font-family:font family; example:"font family" or 'font family' |
10-21-2012, 03:29 AM | #2 |
frumious Bandersnatch
Posts: 7,515
Karma: 18512745
Join Date: Jan 2008
Location: Spaniard in Sweden
Device: Cybook Orizon, Kobo Aura
|
You can use a double quote inside single quotes, or a single quote/apostrophe inside double quotes.
|
Advert | |
|
10-24-2012, 03:49 PM | #3 |
Enthusiast
Posts: 33
Karma: 2146058
Join Date: May 2011
Device: Kindle 3
|
Using double/single quotes
The use of quotes is optional except when the font name contains a space, in that case you must use them. Personally, I prefer double quotes.
|
10-25-2012, 03:59 AM | #4 |
Member
Posts: 18
Karma: 10
Join Date: Jun 2012
Device: kindle fire,android
|
so if i wanted to use multiple fonts would it look like this?
@font-face { font-family:"1font family" "2font family" "3font family"; font-style: normal; font-weight: normal; src: url(fonts/1font family.ttc); src: url(fonts/2font family.ttc); src: url(fonts/3font family.ttc); } |
10-26-2012, 09:14 PM | #5 |
Booklegger
Posts: 1,801
Karma: 7999816
Join Date: Jun 2009
Location: Toronto, Ontario, Canada
Device: BeBook(1 & 2010), PEZ, PRS-505, Kobo BT, PRS-T1, Playbook, Kobo Touch
|
If you think of the @font-face { } as a declaration of a font, realize that only a single font can be declared at a time. So your declaraion above needs to be broken up into three @font-face declarations. So if @font-face {} is a declaration, then the font-family: name; in a CSS rule is a reference; at that point you can have a series of font names separated by commas. The first name mentioned is the preferred font, each following name (a fallback) is less preferred. The ereader software uses the first on it can find.
Adobe-based ereaders can get very confused with multiple font-names in an @font-face declaration; one of the few times it doesn't totally reject the stylesheet, as far as I can tell. Oh, and those font names are not for a family, they are a specific style and weight. |
Advert | |
|
10-28-2012, 03:29 AM | #6 |
Member
Posts: 18
Karma: 10
Join Date: Jun 2012
Device: kindle fire,android
|
"The first name mentioned is the preferred font, each following name"
I thought you could use multiple embedded fonts in a fixed layout? |
10-28-2012, 04:20 AM | #7 |
frumious Bandersnatch
Posts: 7,515
Karma: 18512745
Join Date: Jan 2008
Location: Spaniard in Sweden
Device: Cybook Orizon, Kobo Aura
|
You can specify several fonts in a style, but in a @font-face rule it makes no sense, because the meaning here is different: in a style, font-family gives a list to choose from; in @font-face, font-family specifies which family it is defining.
And anyway, giving a list of families to choose from can be useful when you don't know which ones are available, but with embedded fonts? |
10-28-2012, 07:05 PM | #8 |
Member
Posts: 18
Karma: 10
Join Date: Jun 2012
Device: kindle fire,android
|
Jellby,
"in a style, font-family gives a list to choose from" can you write an example of what it would looks like with multiple fonts to choose from? I'm pretty sure but unsure if that makes any sense. Thanks. |
10-29-2012, 08:36 AM | #9 |
frumious Bandersnatch
Posts: 7,515
Karma: 18512745
Join Date: Jan 2008
Location: Spaniard in Sweden
Device: Cybook Orizon, Kobo Aura
|
Code:
h1 { font-family: Verdana, Arial, sans-serif; } This is mainly for web pages and browsers, which usually can access to the whole set of system-installed fonts, and thus "available" has a meaning for them. In current ebook readers, however, there is often no way to install fonts, and when there is, the actual rendering software has no way (or is not adequately configured) to access them, so in practice there is no font "available" (unless it's embedded). |
10-29-2012, 04:09 PM | #10 |
Member
Posts: 18
Karma: 10
Join Date: Jun 2012
Device: kindle fire,android
|
Jellby,
Thanks |
|
Similar Threads | ||||
Thread | Thread Starter | Forum | Replies | Last Post |
PRS-T1 Adding two fonts into the CSS? | WarGhSt | Sony Reader | 1 | 02-02-2012 01:41 AM |
Am i doing it right?PRS+ and CSS forced Epub fonts via Calibre | melkorbauglir | Sony Reader | 20 | 07-29-2011 10:09 AM |
Opus Fonts directory for Calibre -> External CSS | fiery | Bookeen | 12 | 02-20-2011 10:05 PM |
nook fonts via CSS | danrodney | Barnes & Noble NOOK | 1 | 12-21-2010 07:56 AM |
Possible to embed fonts in CSS of .lit file? | tanzer21 | Calibre | 9 | 06-30-2010 07:26 PM |