Assignment: Styles

The object of this assignment is to use internal style sheets.

Read everything before doing anything.

Copy and paste the following HTML into a file and save it in the assignments folder with the name style1.html.


<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>CIT 040 - Your Name - Styles</title>
<style type="text/css">

/* Your styles go here */

</style>
</head>

<body>
<h1>Weather</h1>

<h2>Three Day Forecast</h2>

<dl>
<dt>Today</dt>
	<dd>
	Partly Cloudy.
	High 68&#176;-72&#176;.
	Low 52&#176;-56&#176;.
	</dd>

<dt>Wednesday</dt>
	<dd>
	Morning Fog.
	High 71&#176;-75&#176;.
	Low 50&#176;-54&#176;.
	</dd>

<dt>Thursday</dt>
	<dd>
	Partly Sunny.
	High 71&#176;-74&#176;.
	Low 48&#176;-52&#176;.
	</dd>
</dl>

<h2>Bay Area Microclimates</h2>

<div>
<h3>San Jose Area</h3>
<p>
Night and morning fog through Wednesday with partly cloudy skies
otherwise. Highs, upper 60s to 70s. Lows in the 50s.
</p>
</div>

<div>
<h3>San Francisco</h3>
<p>
Partly cloudy today after moning fog. Fog giving way to sunny skies
Wednesday. Highs mid-60s to mid-70s. Lows near 50.
</p>
</div>

<h2>California Forecast</h2>
<p>
Today through Thursday: Cooler than normal temperatures throughout
the state through Thursday.  There is a chance for isolated showers
across the Southern California mountains by Wednesday afternoon.
</p>

</body>
</html>

Take a look at the file in a browser, so you can see what it looks like without any styling. Then make the following changes to the document:

Other Requirements

See a screenshot of the result. Your fonts may look different; the screen shot was created on a Linux system, which has different fonts than Windows.

Remember to put a link to the assignment file in your index.html file.