Code
[http://www.xueit.com]
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Gmind Solusion-DivElement Layout</title>
<link href="CSS/StyleSheet.css" rel="Stylesheet" type="text/css" />
</head>
<body>
<div style="width:99%; height:565px;">
<div class="divHeaderTable">
<div class="divHeaderRow">
<div class="divHeaderColumn">
<img alt="Offshore Outsourcing software development company India"
title="Offshore Outsourcing software development company India"
src="Images/gmind.png" width="100%" height="105" />
</div>
<div class="divHeaderColumn">
</div>
<div class="divHeaderColumn">
<div>
<img alt="Gmind" width="15" height="10" src="Images/smllindia.jpg" />
91-9702989270
</div>
<div>
<img alt="Gmind" src="Images/smallusa.jpg" />
91-9924839208
</div>
<div>
</div>
<div>
</div>
</div>
</div>
</div>
<div id="menu" class="divHeaderTable" >
<ul style="list-style-type:none;" >
<li style="float:left"><a href="javascript:void(0);" >Home</a> </li>
<li style="float:left"><a href="javascript:void(0);" >About Us</a> </li>
<li style="float:left"><a href="javascript:void(0);" >Services</a> </li>
<li style="float:left"><a href="javascript:void(0);" >Technology</a> </li>
<li style="float:left"><a href="javascript:void(0);" >Outsourcing</a> </li>
<li style="float:left"><a href="javascript:void(0);" >Quality</a> </li>
<li style="float:left"><a href="javascript:void(0);" >Career</a> </li>
<li style="float:left"><a href="javascript:void(0);" >Blogs</a> </li>
<li style="float:left"><a href="javascript:void(0);" >Partner</a> </li>
<li><a href="javascript:void(0);" title="Contact Us">Contact Us</a> </li>
</ul>
</div>
<div id="divHeader" class="divHeaderTable">
<h4>User Registration</h4>
</div>
<div id="content" class="divTable">
<div class="divRow">
<div class="divColumn">
<div>
<label id="lblSolutation" > Solutation</label>
</div>
<div>
<input type="text" id="txtSolutation" />
</div>
</div>
<div class="divColumn">
<div>
<label id="lblFname" > First Name</label>
</div>
<div>
<input type="text" id="Text1" />
</div>
</div>
<div class="divColumn">
<div>
<label id="lblMname" > Middle Name</label>
</div>
<div>
<input type="text" id="Text2" />
</div>
</div>
<div class="divColumn">
<div>
<label id="lblLname" > Last Name</label>
</div>
<div>
<input type="text" id="Text3" />
</div>
</div>
</div>
<div class="divRow">
<div class="divColumn">
<div>
<label id="Label10" > Login Name</label>
</div>
<div>
<input type="text" id="Text13" />
</div>
</div>
<div class="divColumn">
<div>
<label id="Label9" > E-mail</label>
</div>
<div>
<input type="text" id="Text12" />
</div>
</div>
<div class="divColumn">
<div>
<label id="Label7" > Password</label>
</div>
<div>
<input type="password" id="Text10" />
</div>
</div>
<div class="divColumn">
<div>
<label id="Label8" > Confirm Password</label>
</div>
<div>
<input type="password" id="Text11" />
</div>
</div>
</div>
<div class="divRow">
<div class="divColumn" style="width:48%;">
<div>
<label id="Label1" > Address1</label>
</div>
<div>
<textarea id="Text4" style="width:80%;" ></textarea>
</div>
</div>
<div class="divColumn" style="width:48%;">
<div>
<label id="Label3" > Address2</label>
</div>
<div>
<textarea id="Text6" style="width:80%;"> </textarea>
</div>
</div>
</div>
<div class="divRow">
<div class="divColumn">
<div>
<label id="Label2" > State</label>
</div>
<div>
<input type="text" id="Text5" />
</div>
</div>
<div class="divColumn">
<div>
<label id="Label4" > City</label>
</div>
<div>
<input type="text" id="Text7" />
</div>
</div>
<div class="divColumn">
<div>
<label id="Label5" > Country</label>
</div>
<div>
<input type="text" id="Text8" />
</div>
</div>
<div class="divColumn">
<div>
<label id="Label6" > Pin Code</label>
</div>
<div>
<input type="text" id="Text9" />
</div>
</div>
</div>
<br />
<div class="divRow">
<input type="submit" value="Submit" onclick="javascript:void(0);" />
or
<a href="javascript:void(0)">Cancel </a>
</div>
</div>
</div>
<div style="text-align:center; background-color:Green;">
Contact us to discuss your requirements
</div>
</body>
</html>
• 然这个不是唯一的你能使用div 和CSS创建的结构，你也能实现不同的布局。
• 从上面的例子我们可以看到css布局是非常容易和强大 ，因为这个网页下载很快，避免使用过多的标签，制作的网页能吸引更多的搜索引擎。
