Set font-family for two value in case the first one cannot be found in HTML and CSS

Description

The following code shows how to set font-family for two value in case the first one cannot be found.

Example


<!--from   w  w  w . j a  v  a  2 s  .c  o  m-->

<html>
<head>
<title>font-family</title>
<style type='text/css'>
body {
font: 14px sans-serif;
line-height: 30px;
}
span {
background: mistyrose;
border: 1px solid pink;
}
span.font1 {
font-family: "Perpetua Titling MT", serif;
}
span.font2 {
font-family: "Baskerville Old Face", serif;
}
span.font3 {
font-family: "Lucida Bright", monospace;
}
span.font4 {
font-family: Herculanum, "Eras Demi ITC", sans-serif;
}
</style>
</head>
<body>
<p>
<span class='font1'>font face</span>.
<span class='font2'>specify fallback fonts</span>,
<span class='font3'>
fonts that are used when your first choice
(or choices) aren't installed on the end user's OS
</span>.
<span class='font4'>Windows platform</span>,
</p>
</body>
</html>

Click to view the demo

The code above generates the following result.

Set font-family for two value in case the first one cannot be found in HTML and CSS
Home »
  HTML CSS Tutorial »
    Text »
      Font Family
HTML CSS Tutorial Font Family
Set font-family for two value in case the f...
Set font-family to cursive in HTML and CSS
Set font-family to monospace in HTML and CS...
Set font-family to sans-serif in HTML and C...
Set font-family to serif in HTML and CSS