Embedded Files
In class exercise
In class exercise
Using an online HTML and CSS demonstrator, enter this HTML:
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<h1>Classes tied and not tied to an element</h1>
<p>Define a particular class for only one type of element<br>
p.special {<br>
}
<br>
</p>
<p>Define a class to be useable for more than one type of element<br>
.special {<br>}
</p>
<p>Apply CSS to multiple elements<br>
h1, h2, h3 {<br>
}
</p>
<h1>Why I love Washington DC</h1>
<h2>The sun is strong and the people are great.</h2>
<p>DC is a large town in the East Coast. This text should be red. </p>
<p class="important">Warning: We have no slow cars here.</p>
<h2 class="typewriter">This heading is in typewriter text.</h2>
<p class="typewriter">This paragraph is also in typewriter text.</p>
</body>
</html>
In the CSS portion of the online demonstrator, enter these styles:
p {
font-family: Georgia, "Times New Roman", Times, serif;
font-size: 1.2em;
color: green;
}
p.important {
font-size: 1.5em;
color: red;
}
h1 {
font-family: "Trebuchet MS", Helvetica, sans-serif;
font-size: 2em;
}
.typewriter {
font-family: "Courier New", Courier, monospace;
color: blue;
}
Look at the website this HTML and CSS creates:
Report abuse