CSS: font-family fallbacks

ElMiko · 02-08-2012, 01:42 AM

is there any way to make a font-family fallback a font-style?

for example: I would like text to be in "Courier", but if it can't be displayed as "Courier", then I'd like it to display whatever font it does use in italics.

DaleDe · 02-08-2012, 01:11 PM

Try: font-family:"Courier New", Courier, monospace;

The fallback is via a comma separated list with the last entry as generic as possible.

ElMiko · 02-08-2012, 02:21 PM

right, I understand how the format works for creating font-family fallbacks. But my question was can i make a font-style a fallback for a font-family. The example you gave is for monospace font-families as fallbacks for a monospace font. As I said (almost verbatim), I want the fallback for "Courier" to be whatever font the device renders, but in italics.

Keroberos · 02-08-2012, 03:01 PM

Sounds like you want it to be in non italic Courier if the font is available and in an italic font if not. The way I would do it is to embed a non italic font in the epub (I don't think you can legally embed Courier though, you might have to find a similar font that you can embed), then use this CSS,

Code:

@font-face {
	font-family: "somefont";
	src: url(../Fonts/somefont.otf);	
}
.somefont {
	font-family: "somefont";
	font-style: italic;
}

With this styling in your XHTML,

Code:

<span class="somefont">Text</span>

Then if the reader doesn't support the embedded font it displays in italics of the default font.

ElMiko · 02-08-2012, 04:43 PM

Keroberos, you exactly articulated my intent, thank you! Unfortunately, it seems that your answer is: No, you can't use styles as a fallback. Oh well, it's no great loss.

02-08-2012, 01:42 AM	#1
ElMiko Fanatic Posts: 511 Karma: 65460 Join Date: Jun 2011 Device: Kindle	CSS: font-family fallbacks is there any way to make a font-family fallback a font-style? for example: I would like text to be in "Courier", but if it can't be displayed as "Courier", then I'd like it to display whatever font it does use in italics.

02-08-2012, 03:01 PM	#4
Keroberos Zealot Posts: 128 Karma: 238654 Join Date: Aug 2009 Device: Kobo Mini (4GB), Nook Classic wi-fi, iPod Touch (Bluefire Reader)	Sounds like you want it to be in non italic Courier if the font is available and in an italic font if not. The way I would do it is to embed a non italic font in the epub (I don't think you can legally embed Courier though, you might have to find a similar font that you can embed), then use this CSS, Code: @font-face { font-family: "somefont"; src: url(../Fonts/somefont.otf); } .somefont { font-family: "somefont"; font-style: italic; } With this styling in your XHTML, Code: <span class="somefont">Text</span> Then if the reader doesn't support the embedded font it displays in italics of the default font.

Similar Threads
Thread	Thread Starter	Forum	Replies	Last Post
Font fail with Epub CSS	gregcd	Sony Reader	0	10-28-2010 04:45 PM
Changing Font Family	thymaster	Sony Reader	6	09-19-2010 02:10 AM
Basic CSS Font family question!	kjk	ePub	2	05-27-2010 02:28 PM
Free Font Family für ePubs?	toertchn	Deutsches Forum	3	05-24-2009 05:02 PM
Font Family should help Contrast	jbruce	Sony Reader	31	04-17-2009 01:43 AM

02-08-2012, 01:11 PM	#2
DaleDe Grand Sorcerer Posts: 11,470 Karma: 13095790 Join Date: Aug 2007 Location: Grass Valley, CA Device: EB 1150, EZ Reader, Literati, iPad 2 & Air 2, iPhone 7	Try: font-family:"Courier New", Courier, monospace; The fallback is via a comma separated list with the last entry as generic as possible.

02-08-2012, 02:21 PM	#3
ElMiko Fanatic Posts: 511 Karma: 65460 Join Date: Jun 2011 Device: Kindle	right, I understand how the format works for creating font-family fallbacks. But my question was can i make a font-style a fallback for a font-family. The example you gave is for monospace font-families as fallbacks for a monospace font. As I said (almost verbatim), I want the fallback for "Courier" to be whatever font the device renders, but in italics.

02-08-2012, 04:43 PM	#5
ElMiko Fanatic Posts: 511 Karma: 65460 Join Date: Jun 2011 Device: Kindle	Keroberos, you exactly articulated my intent, thank you! Unfortunately, it seems that your answer is: No, you can't use styles as a fallback. Oh well, it's no great loss.

Advert

Advert