The easiest place to type styles is in the HTML itself. It is also the least useful as you will see later. Start easy though!
You should remember attributes and values from HTML.
There is a STYLE attribute. Its value is all the styles you fancy adding in a list.
Applying a single style to an HTML element
This example is as easy as it gets:
<p style="color:red;">
Save page2.html (created in the beginners html tutorial) as firstcss.html and place the STYLE attribute and value into your first opening paragraph tag. Tthe end tag doesn't need to change. View the page in a browser and the first paragraph should now be red. There is a better way to do colour as you will find out later but this one is fine as well.
Now try replacing your body tag with this one:
<body style="background-color:yellow;">
It may not be easy on the eyes but that should set the background colour of your page to yellow.
The CSS property/value pair is separated by a colon and terminated by a semi-colon (which is not strictly necessary in this example but putting them there is a useful habit ready for later). The property here is background-color and the value is yellow.
Multiple styles
To apply more than one style:
<body style="background-color:yellow; font-size:12pt;">
As long as you end each style statement with a semi-colon you can add more. That's why it is best to use a ; at the end of the final property/value pair. That way if you add another on the end you don't forget to put the ; before the new style.
You can change almost any characteristic of an HTML element using in-line CSS. However the changes apply to just that one HTML element. That is why only one paragraph turned red.
SPANS
You found out what SPANs were earlier but they weren't much use. Now they can be!
You can apply styles to just part of an HTML element. For example, one part of a paragraph. To do this you enclose the part you want to style in SPAN tags:
<p>Some text will not be affected but <span style="background-color:yellow; font-size:12pt;">this text will
be</span> I hope.</p>
Paste that into your Web page at the end (but inside the BODY of course). Use SPANs any time you need to change part of a paragraph.
Before you learn more styles you need to learn two other ways to apply the styles.
