I'm new to CSS and I'm trying to figure out the difference between the
Header tags, div, span, and p tags as they relate to style sheets. They
each render slightly different in the browser and accept different styles.
I was wondering if there is any hard and fast rule or if it's just a matter
of playing around and discovering ones preferences.
Thanks,
Jim
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<title>Untitled</title>
<style language='css/text'>
h1 a {
background-color: lightgrey;
font-size: 2em;
color: white;
border-bottom: thick black solid;
text-decoration: none;
cursor: pointer;
}
h1 a:hover {
color: red;
}
p a {
background-color: lightgrey;
font-size: 2em;
color: white;
margin:0;
padding: 0px;
border-bottom: thick black solid;
text-decoration: none;
cursor: pointer;
}
p a:hover {
color: blue;
}
div a {
background-color: lightgrey;
font-size: 2em;
color: white;
border-bottom: thick black solid;
text-decoration: none;
cursor: pointer;
}
div a:hover {
color: green;
}
span a {
background-color: lightgrey;
font-size: 2em;
color: white;
border-bottom: thick black solid;
text-decoration: none;
cursor: pointer;
}
span a:hover {
color: yellow;
}
</style>
</head>
<body>
<h1><a href=''>This is the H1 Text</a></h1>
<p><a href=''>This is the p Text</a></p>
<div><a href=''>This is the div Text</a></div>
<span><a href=''>This is the span Text</a></span>
</body>
</html>
