Simple CSS Style

The HTML basic framework is completed, let's add some basic cascaded style sheet (CSS) to a better presentation of our website.

The id #nav_container { } is use for menu style, to control the list type style.
The id #nav_container li { } is use to stack the menu in horizontal using the display inline-block.
The id #nav_container li a { } is use to style of your menu links.
The class .left_column { } is use to style your website left column.
The class .right_column { } is use to style your website right column.

Sample Cascaded Style Sheet (CSS)

#nav_container {

list-style-type: none;

background: grey;

margin-bottom: 15px;

}

#nav_container li {

display: inline-block;

}

#nav_container li a {

display: inline-block;

text-decoration: none;

padding: 5px;

color: white;

}

#nav_container li a:hover {

color: black;

}

.left_column {

margin-right:170px;

}

.right_column {

float:right;

width:160px;

}

Learn these html, stylesheet, and javascript programming, visit Codecademy.com website.