Oops, try again

Language Help Make & Deploy a Website
1

Oops, try again. Make sure you set the body’s background-color to brown.

1280×1024 150 KB

2

Your body has no attributes, it still says <body>

3

How do You do that??

4

Put your cursor after the ‘y’ in <body> and add the appropriate attribute.

5

@timothy87,
I think it is better, if one understands the concept.

It all start’s with you,
using a Browser
in which you load a HTML-file,
which we will call the HTML-Document.

This document has a minimal build of

<!DOCTYPE html>
  <html>
     <head>
          <title> </title>
     </head>
     <body>
     </body>
  </html>

The Browser =load’s= this document into Memory
in a pattern that is described as
the Document Object Model
in short the DOM.
( the interpretation of the DOM is Browser & Version specific )

            html
             |
       +-----+------+
       |            |
     head          body
       |
     title

In the description of your document in DOM-talk…
you will encounter terms like:
parent children sibling descendants ascendants…

The HTML-Element has no parent
but is a parent to 2 child-Element’s
the ‘head’-Element
and
the ‘body’-Element.

The ‘head’- and ‘body’-Element,
both being children to the ‘html’-Element
are siblings to each-other.

The ‘head’-Element is parent to the ‘title’-Element…
the ‘title’-Element is a child of the ‘head’-Element
the ‘title’-Element is also a descendant of the ‘html’-Element.

The DOM has several interface’s
over which you can access the data**/**information
held by the DOM.

One of the interface’s is the Element-interface
you can divide the interface into
properties ( consisting of a property-key and it’s associated VALUE )
and
methods ( giving you the functionality to manipulate the Elements )


6

@timothy87,

<!DOCTYPE html>
<html>
	<head>
		<title>First font size change</title>
	</head>
	<body>
	   <p style = "font-size:8px"> Some text for you to make tiny! </p>
	   <p style = "font-size:10px ; background-color: blue"> Some text for you to make normal size!</p>
	   <p style = "font-size:18px> Some text for you to make super big!</p>
 	</body>
</html>

You see the HTML-page,
with a HEADER characterised by the HEAD-Tags <head></head>
with a BODY characterised by the BODY-Tags <body></body>

within the BODY you have 3 PARAGRAPH-Tags <p></p>

Within the opening-Tag of a HTML-Element like the p-Tag
you can insert so-called attributes.

One of those attributes is the style-attribute
with which you can manipulate the display-style of a HTML-Element.

Now we run into the usage of the word property
Each property consists of a property-key and it’s associated VALUE
If you have more then one property you use the semi-colon-; as separator

The syntax of writing a property is
the property-key a colon and it’s associated VALUE
thus the font-size-property would look like:
font-size: 12px

As the font-size is a property
of the style-attribute we would write
style = "font-size: 12px"
or ( with multiple properties )
style = "font-size:12px ; background-color: blue"
we are using the semi-colon-; as a so-called separator

We now integrate this into the starting < p>-Tag

 <p  style = "font-size:12px ; background-color: blue" ></p>

The -background-color of this p-Tag will be blue
and the characters of the TEXT
which we write in-between the p-Tags
will have a font-size of 12 pixels.

7

You should have added the background-color:brown to your body opening tag, remove the paragraph tags where currently the brown background color is at

8

Like this

1280×1024 139 KB

9

no, you can simple add the style attribute to the body opening tag:

<body style="">
10

Ok that was it thanks