untitled

(John Hannent) #1
create a separate selector for each, just group the headline styles into a
single style specification. Open your .css file in Notepad and add the selector
group shown in bold here:

p
{
color: blue;
text-align: center;
font-family: arial!Important;
font-size:18.0pt!Important
}
h1, h2
{
font-family: ravie!Important;
font-style: normal!Important
text-align: center;
}

Notice that you don’t need to add the !Importantcommand to center the
headlines because the embedded Microsoft CSS selectors for headlines make
no mention of alignment. Therefore, your external style sheet has free reign
to make any changes to this attribute that you want.

When Cascades Collide ................................................................................


To see how the browser handles two external files when their styles compete,
use Notepad to create a second .css file with this paragraph selector definition:

p
{
color: maroon;
text-align: center;
font-family: arial!Important;
font-size:18.0pt!Important
}

Save this file as MySecond.css.

Now, link this second .css file to your MyFirst.htm file by adding the link in
boldface to the HTML code you’ve been working with in the previous
examples:

<link type=”text/css” rel=”stylesheet” href=”MyFirst.css”>
<link type=”text/css” rel=”stylesheet” href=”MySecond.css”>
<title>Building your First Style Sheet</title>

64 Part I: The ABCs of CSS

Free download pdf