Let's add some color so that you can see this project start to take shape. Therefore, add a style element inside the header
block, and inside it, add the color classes to assign as attributes to elements inside the HTML body. These classes come from the Flat UI color section of the previous chapter. The blue shades will work nicely for this project:
<head> <style> .black { background-color: black; } .color-0 { background-color: #85C4ED; } .color-1 { background-color: #58ADE3; } .color-2 { background-color: #3499DB; } .color-3 { background-color: #0F85D1; } .color-4 { background-color: #0665A2; } .wet-asphalt { background-color:#34495e; } </style> </head>
Next, we need to assign these general color class attributes to some of our elements. Add the black
class to the main
HTML5 element. To the next section
block, stratosphere
, add the wet-asphalt
class to its first child DIV
element. In the following four DIV
elements, add the classes color-4
, color...