ASP.NET入门经典

图 2-5

(6) 添加<div>标记分隔页面可以简化页面格式的修改。创建的Master页面将在<form>内使用4个<div>区域。有些区域中会包含其他<div>标记(子层次结构的<div>)。第一个<div>是由VWD自动创建的；其他的需手动添加。可以从工具箱的HTML面板中将<div>拖放到页面上，但是在Design视图中很难将其放到正确的位置上。您可以使用Source视图进行精确定位。

(7) 切换到Source视图并在窗体内找到默认的<div>。从<div>标记的开头到</div>标记的末尾都选中，可以注意到Properties窗口中现在显示的是<div>的属性。将id属性设置为content。

(8) 继续停留在Source视图中，通过拖放将另一个<div>从工具箱的HTML面板中拖放到<div id=“content”>的上方，但仍然在<form>内。将其id属性设置为header。

(9) 在表单内另外添加两个<div>标记。将标题下面的第一个<div>的id设置为sidebar，并将最下面的那个<div>的id设置为footer。

(10) 在Source视图中，现在创建子层次结构的<div>标记，这些标记将位于前面创建的<div>内部。在header<div>内，拖放一个<div>并将其id设置为logo。在logo <div>的后面将显示一些简单的文本，如下所示：

<form id="mainForm" runat="server">

<div id="header">

<div id="logo"></div>