Good programmers put all the style information for an webpage in the
<style>
block up inside the <head>
of your document.
However, the hideous truth is that you can add style
code into any HTML tag using the style=""
attribute:
<p style="color: red; text-align: center; text-style: bold;">
Hey look! I can micro-format each line!
</p>
However, it is bad style and you really should do anything to avoid it.
Instead, make sure that your place your
<style>
code inside the
<head>
of your document.
Make all of your formatting and style decisions here,
and use CSS selectors to identify your code.
Remember that your identifiers work like this:
-
p {}
— for styling regular HTML tags -
#buttonId {}
— for styling tags with anid="buttonId"
attribute -
.songClass {}
— for styling tags with aclass="songClass"
attribute
<html>
<head>
<style>
/* it is best to put ALL your CSS code here inside the <head> */
strong {
color: red;
}
h1 {
color: blue;
}
#starId {
color: blue;
font-style: italic;
}
</style>
</head>
<body>
<!-- It is possible to put your style inside a tag, but it is POOR STYLE -->
<h1>Monty Python's <span style="font-style: italic">Argument</span> sketch</h1>
<p>
<!-- instead, add a class or an id to the tag and define it in the <head> -->
<strong>Man (<span id="starId">Michael Palin</span>):</strong>
Ah. I'd like to have an argument, please.
</p>
<p>
<strong>Receptionist:</strong>
Certainly sir. Have you been here before?
</p>
<p>
<strong>Man:</strong>
No, this is my first time.
</p>
<p>
<strong>Receptionist:</strong>
I see. Well, do you want to have the full argument, or were you thinking of taking a course?
</p>
</body>
</html>