--description--
Now we've proven that every HTML page has a body
element, and that its body
element can also be styled with CSS.
Remember, you can style your body
element just like any other HTML element, and all your other elements will inherit your body
element's styles.
--instructions--
First, create a h1
element with the text Hello World
Then, let's give all elements on your page the color of green
by adding color: green;
to your body
element's style declaration.
Finally, give your body
element the font-family of monospace
by adding font-family: monospace;
to your body
element's style declaration.
--hints--
You should create an h1
element.
assert($('h1').length > 0);
Your h1
element should have the text Hello World
.
assert(
$('h1').length > 0 &&
$('h1')
.text()
.match(/hello world/i)
);
Your h1
element should have a closing tag.
assert(
code.match(/<\/h1>/g) &&
code.match(/<h1/g) &&
code.match(/<\/h1>/g).length === code.match(/<h1/g).length
);
Your body
element should have the color
property of green
.
assert($('body').css('color') === 'rgb(0, 128, 0)');
Your body
element should have the font-family
property of monospace
.
assert(
$('body')
.css('font-family')
.match(/monospace/i)
);
Your h1
element should inherit the font monospace
from your body
element.
assert(
$('h1').length > 0 &&
$('h1')
.css('font-family')
.match(/monospace/i)
);
Your h1
element should inherit the color green
from your body
element.
assert($('h1').length > 0 && $('h1').css('color') === 'rgb(0, 128, 0)');
--seed--
--seed-contents--
<style>
body {
background-color: black;
}
</style>
--solutions--
<style>
body {
background-color: black;
font-family: monospace;
color: green;
}
</style>
<h1>Hello World!</h1>