在Web開發中，要設計一個網站的布局是非常重要的一步。在DW（Dreamweaver）中，我們可以使用CSS（層疊樣式表）來定義元素的樣式，從而實現網頁的布局。

/* 定義網頁的基本樣式 */
body {
margin: 0;
padding: 0;
font-family: Arial, sans-serif;
background-color: #fff;
color: #333;
}
/* 定義頭部區域樣式 */
header {
background-color: #ccc;
height: 80px;
}
/* 定義主體區域樣式 */
#wrapper {
width: 960px;
margin: 0 auto;
}
#content {
float: left;
width: 700px;
padding: 20px;
}
#sidebar {
float: right;
width: 200px;
padding: 20px;
}
/* 定義頁腳區域樣式 */
footer {
background-color: #999;
height: 50px;
clear: both;
}

在上面的代碼中，我們通過選擇器來定義了網頁中的不同元素的樣式。首先，我們定義了整個網頁的基本樣式，包括頁面的背景顏色、字體樣式等。接下來，我們定義了頭部、主體和頁腳區域的樣式。在主體區域中，我們使用了浮動布局（float）來讓內容區域和側邊欄并排布局，并設置了寬度和內邊距。在頁腳區域，我們使用了clear屬性來清除浮動。

通過CSS可以定義出網頁的基本布局，我們在DW中通過CSS面板來管理CSS代碼，可以快速修改樣式，實現網頁的美化與布局。