HTML5 and CSS3 All-in-One For Dummies
Book image
Explore Book Buy On Amazon
To assign a font family to part of your page, use some new CSS. As an example, this page has the heading set to Comic Sans MS. If this page is viewed on a Windows machine, it generally displays the font correctly because Comic Sans MS is installed with most versions of Windows. If you're on another type of machine, you may get something else. Look at the simple case.

Here's the code:

<!DOCTYPE html>
<html lang = "en-US">
 <head>
 <meta charset = "UTF-8">
 <title>comicHead.html</title>
 <style type = "text/css">
  h1 {
  font-family: "Comic Sans MS";
  }
 </style>
 </head>
 <body>
 <h1>This is a heading</h1>
 <p>
  This is ordinary text.
 </p>
 </body>
</html>
The secret to this page is the CSS attribute. Like most CSS elements, this can be applied to any HTML tag on your page. In this particular case, it was applied it to the level one heading.
  h1 {
  font-family: "Comic Sans MS";
  }
You can then attach any font name you wish, and the browser attempts to use that font to display the element.

Even though a font may work perfectly fine on your computer, it may not work if that font isn't installed on the user's machine.

image0.jpg

If you run exactly the same page on an iPad, you might see this result.

image1.jpg

The specific font Comic Sans MS is installed on Windows machines, but the MS stands for Microsoft. This font isn't always installed on Linux or Mac. (Sometimes it's there, and sometimes it isn't.) You can't count on users having any particular fonts installed.

The Comic Sans font is fine for an example, but it has been heavily over-used in web development. Serious web developers avoid using it in real applications because it tends to make your page look amateurish.

About This Article

This article is from the book:

About the book authors:

Andy Harris taught himself programming because it was fun. Today he teaches computer science, game development, and web programming at the university level; is a technology consultant for the state of Indiana; has helped people with disabilities to form their own web development companies; and works with families who wish to teach computing at home.

This article can be found in the category: