This is a basic example of a two column fixed width HTML layout with horizontal CSS layout page navigation using the CSS float
property. This version uses the HTML5 semantic elements nav
, article
, section
, aside
, header
, and footer
. It is a good starting point for students learning CSS who are very new to web technology.
This is the home.html file. It the top page for the web site. The top page would be named index.html
when the file does not contain server side scripting code.
This is the about.html file. With static pages that a lot of HTML needs to be replicated on each page. The page navigation is one example. And even with the page navigation, you have small differences. For example if you want to make the loaded page navigation button to become inactive.
But also think about the page layouts. You may have one page layout for all your pages. Then again you could have different page layouts depending on the content. And even with the page navigation, you have small differences when you want to make the loaded page navigation button to become inactive.
This is the site.css style sheet. Making the style sheet external to the documents, the documents can share the style selectors. Changing a property or style then impacts all the pages.
Start today with easy to learn courses that quicky build your website skills!