HTML and CSS Reference
In-Depth Information
Meet the style element
To add style, you add a new (say it with us) E-L-E-M-E-N-T
to your page—the
<style>
element. Let's go back to the
main Starbuzz page and add some style. Check it out…
J
ust like othe
r elements, t
he <style>
e
lement has a
n opening tag
, <style>,
a
nd a closing
tag, </style>
.
<html>
<head>
<title>
Starbuzz Coffee
</title>
<style type="text/css">
</style>
</head>
<body>
<h1>
Starbuzz Coffee Beverages
</h1>
<h2>
House Blend, $1.49
</h2>
<p>
A smooth, mild blend of coffees from Mexico, Bolivia and
Guatemala.
</p>
<h2>
Mocha Caffe Latte, $2.35
</h2>
<p>
Espresso, steamed milk and chocolate syrup.
</p>
<h2>
Cappuccino, $1.89
</h2>
<p>
A mixture of espresso, steamed milk and milk foam.
</p>
<h2>
Chai Tea, $1.85
</h2>
<p>
A spicy drink made with black tea, spices, milk and honey.
</p>
</body>
</html>
Q:
An element can have an “attribute”? What does that
mean?
A:
Attributes give you a way to provide additional information
about an element. Like, if you have a <style> element, the attribute
allows you to say exactly what kind of style you're talking about.
You'll be seeing a lot more attributes for various elements; just
remember they give you some extra info about the element.
Q:
Why do I have to specify the type of the style (“text/css”)
as an attribute of the style? Are there other kinds of style?
A:
At one time the designers of HTML thought there would be
other styles, but as it turns out we've all come to our senses since
then and you can just use <style> without an attribute—all the
browsers will know you mean CSS. We're disappointed; we were
holding our breath for the <style type=“50sKitsch”> style. Oh well.