cssfonts

CSS: Fallback fonts


My website uses a rather obscure font that about half the computers can properly read. The font is "Lucida Console". On the computers that can't read this font, they get displayed ugly Times New Roman, is there a way to set the font of my website to Lucida Console but on computers that can't read it, view Arial instead? Using CSS.


Solution

  • you can specify multiple fonts:

    p {
        font-family: "Times New Roman", Times, serif;
    }
    

    The browser will try the first one, if that one isn't available the second, and so forth. In the end it uses the family serif, so the browser chooses any serif font. You should use the monospace family.

    So in your case, something like this is what you want:

    p {
        font-family: "Lucida Console", "Courier New", monospace;
    }