Thursday, 5 December 2013

HTML » Layouts

HTML Layout

Be very careful when You design Your page, because the page layout is very important.

HTML Layouts - Using <div> Elements

The div element is a block level element used for grouping HTML elements.



<div id="container" style="width:500px;">

<div id="header" style="height: 50px; background: #F90;">
<h1>This is the Header.</h1>

<div id="main" style="width: 90px; height:200px; background: #CCC; float: left;">
<a href="" target="_blank">id</a><br />
<a href="" target="_blank">class</a><br />
<a href="" target="_blank">Forms</a><br />
<a href="" target="_blank">iFrames</a>

<div id="content" style="width: 500px; height: 200px; background: #0C3;">
Content goes here.

<div id="footer" style="background: #00F; text-align: center;">
Easilylearnhtml &copy;



» Result:

Content goes here.

HTML Layouts - Using Tables

A simple way of creating layouts is by using the HTML <table> tag.

You can create layout with <table> tag, this is NOT the correct use of the element. The purpose of the <table> element is to display tabular data!

No comments:

Post a Comment