A very colourful webpage.
Contents
A Colourfully Styled Page
You can see how the page looks here.
The Source Code
<!DOCTYPE HTML>
<html>
<head>
<title>Hello World</title>
<meta charset="utf-8" />
<style>
body {
background-color:green;
}
h1 {
background-color:orange;
}
h2 {
background-color:aqua;
}
p {
background-color: yellow;
}
li {
background-color:silver;
}
ol {
background-color:fuchsia;
}
ul {
color:lime;
}
strong {
color:white;
background-color:black;
}
mark {
background-color:white;
color: blue;
}
a {
background-color:blue;
color: yellow;
}
</style>
</head>
<body>
<h1>This is a heading (for testing purposes)</h1>
<p>Paragraphs are the bread and butter of HTML.</p>
<p>They can include <strong>strong</strong> tags.
</p>
<ol>
<li>Lists are cool!</li>
<li>The list things.</li>
<li>This one has an <i>i</i> inside.</li>
<li><p>This one contains a <ul>:</p>
<ul>
<li>Item 1</li>
<li><mark>Marked item</mark></li>
<li>Final item</li>
</ul>
<li><h2>What happens with an h2?</h2></li>
<li>Final order</li>
</ol>
<p>A final paragraph with a dummy
<a href="#">link</a> inside it.</p>
</body>
</html>Notes
- Notice that some items are nested inside other items.
- Notice that there seems to be some sort of border or margin around nested elements (they don’t go all the way from one edge of the display to the other)
- Notice that some elements (like strong) only have a limited effect, but other elements seem to stretch almost across the entire display.