Share this Page URL

Chapter 14. A Beginner's Guide to Style ... > What's a style, and what's a sheet? - Pg. 157

A Beginner's Guide to Style Sheets <BODY> <H1>Style Sheets: What's the Big Whoop?</H1> </BODY> </HTML> 157 Figure 14.1. A simple web page, showing just a single <H1> heading. Now suppose you prefer to use bigger text in your heading. You can't change the size of <H1> headings directly, but you could do it by changing the SIZE attribute of the <FONT> tag, like this: <FONT SIZE="7"> Style Sheets: What's the Big Whoop? </FONT> That's no big deal if you have only one or two headings, but what if you use dozens of them? Not only is it a pain to add those <FONT> tags, but it also makes your HTML source code more difficult to read. A better solution is to create a style for the <H1> tag that tells the browser to use a larger font size for the <H1> text. The following HTML file (see ssafter.htm on the CD in this book) shows you one way to do it, and Figure 14.2 displays the results (I explain the spe cifics of this a bit later): <HTML> <HEAD> <TITLE>Style Sheets: After</TITLE> <STYLE> H1 {font-size: 34pt} </STYLE> </HEAD> <BODY> <H1>Style Sheets: What's the Big Whoop?</H1> </BODY> </HTML> Figure 14.2. Use a style to get a larger heading. Note the new <STYLE> tag and, in particular, the following line: H1 {font- size: 34pt} What this tells the browser is that, each time it comes across the <H1> tag, it should format the text with a 34-point font size.