HTML and CSS Reference
In-Depth Information
Add a title to the link to “mission.html” with the text “Read more about Starbuzz Coffee's
important mission.” Notice that we didn't make the mission link's label as concise as it should be.
Shorten the link label to “our Mission”. Here's the solution; did you test your changes?
<html>
<head>
<title>
Starbuzz Coffee
</title>
<style type="text/css">
body {
background-color: #d2b48c;
margin-left: 20%;
margin-right: 20%;
border: 1px dotted gray;
padding: 10px 10px 10px 10px;
font-family: sans-serif;
}
</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 Cafe 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 foam.
</p>
A d
d a
t it
l e
at
t ri b
u t e
to
t h e
m i
s s i o n
l i n
k .
<h2>
Chai Tea, $1.85
</h2>
<p>
A spicy drink made with black tea, spices,
milk and honey.
</p>
<p>
Read about
<a href="mission.html"
title="Read more about Starbuzz Coffee's important mission">
our Mission
</a>
.
<br>
Read the
<a href="http://wickedlysmart.com/buzz"
title="Read all about caffeine on the Buzz">
Caffeine Buzz
</a>
.
</p>
</body>
</html>
Move the “Read about” ou
tside the <a> element.
