传统的布局理论是利用table的无边框、无间距的特性，其最常见的方法是在<table>中嵌入设计代码如width=100% border=0等，表格的混合代码也正是这样编写的，大量的样式设计混在表格和单元格中。
Div布局我们将看不到表格td，取而代之的是div,以下标签是在DIV布局中极为常见的标签：
<DIV>…</DIV>
<H1>…</H1>
<UL>…</UL>
<LI>…</LI>
而XHTML和CSS的接口通过如下方法实现：
<ul id=”content”>…</ul>
<span class=”redlink”>…</span>
下面，我们通过一段div的样式设计代码来看看div的设计：
XHTML部分：
<div class=”content”>…</div>
CSS部分：
.content {
margin: 10px 10px 10px 10px; 
padding:20px 10px 10px 20px; 
border-top: #ccc 2px solid; 
border -right: #ccc  2px  solid; 
border -bottom: #ccc  2px  solid; 
border -left: #ccc  2px solid; 
background: url(images/bg.jpg)  #f8f8f8  no-repeat  right  bottom; 
color: #666; 
text-align: center; 
line-height: 150%; 
width:60%; 
height:60%;
       font-size: 12px;
       font-weight: bold;
       text-decoration: underline;
       text-align: left;
       }