Step 3: divide the website into five divs, which are the basis of the basic layout of the webpage.

1. Put the five parts mentioned in step 1 into a box and write them into the html file:

<Div id = "page-container">
<Div id = "main-nav"> Main Nav </div>
<Div id = "header"> Header </div>
<Div id = "sidebar-a"> Sidebar A </div>
<Div id = "content"> Content </div>
<Div id = "footer"> Footer </div>
</Div>

The performance is as follows:

2. To distinguish the five parts, we will mark these five parts with different background colors and write them into the css file:

# Main-nav {
Background: red;
Height: 50px;
}
# Header {
Background: blue;
Height: 150px;
}
# Sidebar-{
Background: darkgreen;
}
# Content {
Background: green;
}
# Footer {
Background: orange;
Height: 66px;
}