Can CSS be used for alternate fonts?

Question

I know that Alt is used for images in HTML, but is there a way to apply it to text via CSS?

Example:

input { color: #62161e; font-size: 25px; font-family: Lintel; }

So say Lintel does not display properly in some browsers. Is there an alt option to display Helvetica or something?

Answer 1

Yes, you can chain fonts.

font-family: Lintel, Helvetica, Arial, sans-serif;

If you are defining both font-size and font-family I suggest you use the shorthand version:

font: 25px Lintel, Helvetica, Arial, sans-serif;

You can add more to this as well:

font: (weight) (size)/(line-height) (family);

The only two that are required are size and family.

font: bold 30px/25px Lintel, Helvetica, Arial, sans-serif;

Answer 2

In CSS, you can specify a list of font families to follow and the browser will use the first one that it supports. So if you want to display Helvetica if Lintel is unavailable, you would simply do this:

font-family: Lintel, Helvetica;

Remember that if the font family has a space in it, you need to surround it in double quotes, like with the line I use for my website:

font-family: "Segoe UI", Arial, Helvetica, sans-serif;

Answer 3

You can provide multiple fonts and the browser will pick the first available font.