Ocean Blue Template <H1> Tag
Download the Ocean Blue Template in zipped format.
The Ocean Blue template uses a fluid layout with a masthead, top menu, full width content area and footer. The container is sized to be 80% of the viewer's window but will not exceed 1300 pixels. The top menu for this template is from CSS Drive - Matt Black Tabs. Be careful how many links you add or the menu will break at lower resolutions.
The template uses a XHTML Transitional doctype. Both the template and the style sheet validate.
Images <h2> tag
The page background is a solid color. You could also use a gradient image or a seamless tiled image for the page background.
The Site Name is a graphic image sized at 603 x 112 pixels. You can create your own image to use but depending on the height, you may have to adjust the banner <div> height which is set at 132px. Classes have been created to float the images within the content area to the left or right. Images you use within your content area should be resized in an image editor to the size you are going to use and a 1px border added. ALL images should have an alt attribute for accessibility reasons. A blank one is fine if the image is just a decoration.
Editing template CSS <h3> tag
All styling for this template is within the external style sheet which has been commented for the various sections. If you want to change the font or the colors, make the change within the style sheet. Basic styles have been included but you will need to create others as you add content.
The lists within the content <div> use a graphic image for the bullets. The zipped package includes this page, and all supporting files/folders. A blank template is also include that you can use to create additional pages.
Ut quis odio. In hac habitasse platea dictumst. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. In hac habitasse platea dictumst. Nunc mi. Integer congue, eros eu elementum gravida, nibh augue hendrerit purus, sed vehicula tellus augue id justo. Mauris et massa. Vestibulum viverra nonummy erat. Pellentesque pellentesque dui non est aliquet accumsan. Proin tellus mauris, fermentum ornare, rhoncus volutpat, ultricies vel, metus. Proin pulvinar, massa et porttitor eleifend, tortor lacus suscipit quam, id molestie dui sem non turpis. Cras suscipit, elit porttitor fringilla consequat, orci massa ullamcorper urna, vitae lacinia pede dolor eget ligula. Nulla augue felis, venenatis nec, rutrum et, sagittis id, odio. Duis vitae augue.
This is how a list will look:
- Main item
- Main Item
- Main Item
- Sub Item
- Sub Item
Nunc urna. Mauris lectus. Nunc mollis vulputate dolor. Etiam odio enim, bibendum sed, egestas sed, pharetra vel, elit. Maecenas eros ligula, viverra a, placerat a, dictum et, risus. Mauris elit. Vivamus cursus consequat nunc. Proin et nunc sed nibh tempus tempus. Curabitur hendrerit interdum nisl. Nulla bibendum varius turpis. In condimentum ultrices eros. Nullam ligula tellus, pharetra et, faucibus non, vestibulum eget, leo. Vestibulum vitae nisi sed eros condimentum rutrum. Pellentesque in purus. Proin nisi risus, tempor sit amet, auctor eu, ultrices vitae, nisi. Donec rhoncus semper nunc. Nunc feugiat sodales dui. Morbi lectus. Vestibulum non dolor nec nibh egestas gravida. Vestibulum augue.