MobileRead Forums

MobileRead Forums (https://www.mobileread.com/forums/index.php)
-   Kindle Formats (https://www.mobileread.com/forums/forumdisplay.php?f=168)
-   -   working with fonts in css (https://www.mobileread.com/forums/showthread.php?t=194435)

jayz 10-20-2012 03:14 PM

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'

Jellby 10-21-2012 04:29 AM

You can use a double quote inside single quotes, or a single quote/apostrophe inside double quotes.

Grey Ram 10-24-2012 04:49 PM

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.

jayz 10-25-2012 04:59 AM

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);
}

pholy 10-26-2012 10:14 PM

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.

jayz 10-28-2012 04:29 AM

"The first name mentioned is the preferred font, each following name"

I thought you could use multiple embedded fonts in a fixed layout?

Jellby 10-28-2012 05:20 AM

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?

jayz 10-28-2012 08:05 PM

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.

Jellby 10-29-2012 09:36 AM

Code:

h1 { font-family: Verdana, Arial, sans-serif; }
This uses, for <h1> elements, the Verdana font if available, else Arial, and as a last choice the default sans-serif font (which sometimes the user can select and sometimes it's hard-coded in the rendering software).

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).

jayz 10-29-2012 05:09 PM

Jellby,

Thanks


All times are GMT -4. The time now is 06:52 PM.

Powered by: vBulletin
Copyright ©2000 - 3.8.5, Jelsoft Enterprises Ltd.
MobileRead.com is a privately owned, operated and funded community.