网站制作学习 广告位

本节设计一个简单的网页,就拿本站http://www.forasp.cn 首页来做。
首先打开Dreamweaver 选择文件-》新建 选择基本页, html即可 在打开的页面中打开“代码 拆分 设计”中的代码页面你会看到如下代码:
<!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>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
</head>
<body>
</body>
</html>
在body中,加入如下代码
<table width="760" height="35" border="0" align="center" cellpadding="0" cellspacing="1" bgcolor="#999999">
<tr>
<td align="left" valign="middle" bgcolor="#FFFFFF">  首页 | 注册 | 搜索 | 会员 | 关于网站制作学习网 | 加入收藏 | 用户名:<input name="textfield" type="text" size="10" />
密码:<input name="textfield2" type="text" size="10" />
<select name="select">
<option>不存</option>
<option>一天</option>
<option>一月</option>
<option>一年</option>
</select>
<input type="submit" name="Submit" value="确定" />
</td>
</tr>
</table>
上面的table 只分了一行一列,以圆角的空格隔开。
你会看到的效果是:网站制作学习网的顶部代码页面
继续下面的代码
<table width="760" border="0" align="center" cellpadding="0" cellspacing="1" bgcolor="#999999" style="margin-top:5px;">
<tr>
<td bgcolor="#FFFFFF"><img src="teach_img/logo2.gif" alt="网站制作学习网" width="170" height="82" align="left" longdesc="http://www.forasp.cn" /><img src="teach_img/ad.gif" alt="广告位" width="580" height="82" align="right" /></td>
</tr>
</table>
上面的table 只分了一行二列,中间用<img>填充。
你会看到的效果是:网站制作学习网的顶部代码页面
继续第三部代码
<table width="760" height="25" border="0" align="center" cellpadding="0" cellspacing="1" bgcolor="#999999" style="margin-top:5px;">
<tr>
<td align="left" valign="middle" bgcolor="#FFFFFF"> ASP | PHOTOSHOP | 网站优化 | FLASH | 网络技术 | JS脚本 | 网络资源&amp;赚钱 | 网站经验</td>
</tr>
</table>
也采用一行一列 中间全角 空格隔开。
你会看到的效果 是: 网站制作学习网的顶部代码页面
<table width="760" height="30" border="0" align="center" cellpadding="0" cellspacing="1" bgcolor="#999999" style="margin-top:5px;">
<tr>
<td align="center" valign="middle" bgcolor="#FFFFFF">按用户名:<input name="textfield3" type="text" size="10"/>
按标题:<input name="textfield4" type="text" size="10"/>
按内容:<input type="text" name="textfield5" size="10"/>
<select name="select2" style="font:12px;">
<option selected="selected">所有栏目</option>
<option>ASP</option>
<option>PHOTOSHOP</option>
<option>网站优化</option>
<option>FLASH</option>
<option>网络技术</option>
<option>JS脚本</option>
<option>网络资源&amp;赚钱</option>
<option>网站经验</option>
</select>
<input type="submit" name="Submit2" value="确定" /> <input type="checkbox" name="checkbox" value="checkbox" />
包括所有评论 </td>
</tr>
</table>
你会看到的效果 是: 网站制作学习网的顶部代码页面
继续代码
<table width="760" border="0" align="center" cellpadding="0" cellspacing="0" style="margin-top:5px;">
<tr>
<td><img src="teach_img/ad1.gif" alt="广告位" width="760" height="80"/></td>
</tr>
</table>
<table width="760" height="235" border="0" align="center" cellpadding="0" cellspacing="0" style="margin-top:5px;">
<tr>
<td width="221" valign="top"><table width="221" height="233" border="0" cellpadding="0" cellspacing="1" bgcolor="#999999">
<tr>
<td width="219" height="231" align="center" valign="top" bgcolor="#FFFFFF"><table width="215" height="20" border="0" cellpadding="0" cellspacing="0" bgcolor="#CCCCCC" style="margin-top:2px; margin-bottom:2px;">
<tr>
<td align="left" valign="middle"><strong> 每日推荐</strong></td>
</tr>
</table>
<table width="214" height="209" border="0" cellpadding="0" cellspacing="0">
<tr>
<td width="214" height="21" align="left">&middot;本站asp/js技术QQ交流群</td>
</tr>
<tr>
<td height="21" align="left">&middot;你是美工吗?靠自己来赚钱</td>
</tr>
<tr>
<td height="21" align="left">&middot;免费5G大小的网络硬盘</td>
</tr>
<tr>
<td height="21" align="left">&middot;会员注意</td>
</tr>
<tr>
<td height="21" align="left">&middot;设置404错误页面</td>
</tr>
<tr>
<td height="21" align="left">&middot;网页邮件</td>
</tr>
<tr>
<td height="21" align="left">&middot;搜狐体育频道FLASH广告JS调</td>
</tr>
<tr>
<td height="21" align="left">&middot;asp常用函数</td>
</tr>
<tr>
<td height="21" align="left">&middot;asp生成静态页面</td>
</tr>
<tr>
<td height="21" align="left">&middot;[推荐] 获取当前url</td>
</tr>
</table></td>
</tr>
</table> </td>
<td width="318" height="233" align="center" valign="top"><table width="307" height="236" border="0" cellpadding="0" cellspacing="1" bgcolor="#999999">
<tr>
<td width="309" height="233" align="center" bgcolor="#FFFFFF"><img src="teach_img/ad2.gif" alt="网站制作学习网" width="307" height="233" /></td>
</tr>
</table></td>
<td width="221" align="right" valign="top"><table width="221" height="235" border="0" cellpadding="0" cellspacing="1" bgcolor="#999999">
<tr>
<td height="233" align="center" valign="top" bgcolor="#FFFFFF"><table width="215" height="20" border="0" cellpadding="0" cellspacing="0" bgcolor="#CCCCCC" style="margin-bottom:2px; margin-top:2px;">
<tr>
<td align="left" valign="middle"><strong>  人气排行</strong></td>
</tr>
</table><table width="214" height="209" border="0" cellpadding="0" cellspacing="0">
<tr>
<td width="214" height="21" align="left">&middot;本站asp/js技术QQ交流群</td>
</tr>
<tr>
<td height="21" align="left">&middot;你是美工吗?靠自己来赚钱</td>
</tr>
<tr>
<td height="21" align="left">&middot;免费5G大小的网络硬盘</td>
</tr>
<tr>
<td height="21" align="left">&middot;会员注意</td>
</tr>
<tr>
<td height="21" align="left">&middot;设置404错误页面</td>
</tr>
<tr>
<td height="21" align="left">&middot;网页邮件</td>
</tr>
<tr>
<td height="21" align="left">&middot;搜狐体育频道FLASH广告JS调</td>
</tr>
<tr>
<td height="21" align="left">&middot;asp常用函数</td>
</tr>
<tr>
<td height="21" align="left">&middot;asp生成静态页面</td>
</tr>
<tr>
<td height="21" align="left">&middot;[推荐] 获取当前url</td>
</tr>
</table></td>
</tr>
</table></td>
</tr>
</table>
你会看到的效果 是: 网站制作学习网的顶部代码页面
继续代码
<table width="760" border="0" align="center" cellpadding="0" cellspacing="0" style="margin-top:5px;">
<tr>
<td width="380" align="left" valign="top"><table width="375" height="144" border="0" cellpadding="0" cellspacing="1" bgcolor="#999999">
<tr>
<td width="377" align="center" valign="top" bgcolor="#FFFFFF"><table width="371" height="20" border="0" bgcolor="#CCCCCC" style="margin-bottom:2px; margin-top:2px;">
<tr>
<td align="left"> <strong>ASP</strong></td>
</tr>
</table>
<table width="375" border="0" cellpadding="0" cellspacing="0">
<tr>
<td height="21" align="left">&middot;asp 输出设置页面编码</td>
</tr>
<tr>
<td height="21" align="left">&middot;本站asp/js技术QQ交流群</td>
</tr>
<tr>
<td height="21" align="left">&middot;asp 获取日期中年月日</td>
</tr>
<tr>
<td height="21" align="left">&middot;ASP无组件上载,带进度条,多文件上载</td>
</tr>
<tr>
<td height="21" align="left">&middot;仿百度分页代码</td>
</tr>
<tr>
<td height="21" align="left">&middot;在线人数代码</td>
</tr>
<tr>
<td height="21" align="left">&middot;看不到状态栏地址</td>
</tr>
<tr>
<td height="21" align="left">&middot;iframe取部分网页</td>
</tr>
<tr>
<td height="21" align="left">&middot;字母转换成ascII码</td>
</tr>
<tr>
<td height="21" align="left">&middot;日历代码(含属相)</td>
</tr>
</table></td>
</tr>
</table>
</td>
<td width="383" align="right"><table width="375" height="144" border="0" cellpadding="0" cellspacing="1" bgcolor="#999999">
<tr>
<td width="377" align="center" valign="top" bgcolor="#FFFFFF"><table width="371" height="20" border="0" bgcolor="#CCCCCC" style="margin-bottom:2px; margin-top:2px;">
<tr>
<td align="left"> <strong>网站经验</strong></td>
</tr>
</table>
<table width="375" border="0" cellpadding="0" cellspacing="0">
<tr>
<td height="21" align="left">&middot;asp 输出设置页面编码</td>
</tr>
<tr>
<td height="21" align="left">&middot;本站asp/js技术QQ交流群</td>
</tr>
<tr>
<td height="21" align="left">&middot;asp 获取日期中年月日</td>
</tr>
<tr>
<td height="21" align="left">&middot;ASP无组件上载,带进度条,多文件上载</td>
</tr>
<tr>
<td height="21" align="left">&middot;仿百度分页代码</td>
</tr>
<tr>
<td height="21" align="left">&middot;在线人数代码</td>
</tr>
<tr>
<td height="21" align="left">&middot;看不到状态栏地址</td>
</tr>
<tr>
<td height="21" align="left">&middot;iframe取部分网页</td>
</tr>
<tr>
<td height="21" align="left">&middot;字母转换成ascII码</td>
</tr>
<tr>
<td height="21" align="left">&middot;日历代码(含属相)</td>
</tr>
</table></td>
</tr>
</table></td>
</tr>
</table>

你会看到的效果 是: 网站制作学习网的顶部代码页面
重复上面的代码你得出主要框剪内容了 网站制作学习网的顶部代码页面
网站的友情链接
<table width="762" border="0" align="center" cellpadding="0" cellspacing="1" bgcolor="#999999" style="margin-top:5px;">
<tr>
<td width="758" height="25" align="left" bgcolor="#FFFFFF"> <strong>友&middot;情&middot;链&middot;接</strong></td>
</tr>
<tr>
<td bgcolor="#FFFFFF"><table width="758" border="0" cellpadding="0" cellspacing="0">
<tr>
<td width="108" height="25" align="center" valign="middle"><a title="flash钟表" href="http://www.forasp.cn/flash.asp" target="_blank">flash钟表</a></td>
<td width="108" height="25" align="center" valign="middle"><a title="网站制作学习" href="http://www.forasp.cn/" target="_blank">网站制作学习</a><a title="威客网" href="http://www.witkeysky.com" target="_blank"></a></td>
<td width="108" height="25" align="center" valign="middle"><a title="网站制作学习" href="http://www.forasp.cn/" target="_blank">网站制作学习</a><a title="软件测试工具" href="http://www.spasvo.com/" target="_blank"></a></td>
<td width="108" height="25" align="center" valign="middle"><a title="网站制作学习" href="http://www.forasp.cn/" target="_blank">网站制作学习</a></td>
<td width="108" height="25" align="center" valign="middle"><a title="网站制作学习" href="http://www.forasp.cn/" target="_blank">网站制作学习</a><a title="河南360" href="http://www.henan360.com" target="_blank"></a></td>
<td width="108" height="25" align="center" valign="middle"><a title="网站制作学习" href="http://www.forasp.cn/" target="_blank">网站制作学习</a></td>
<td width="110" height="25" align="center" valign="middle"><a title="网站制作学习" href="http://www.forasp.cn/" target="_blank">网站制作学习</a></td>
</tr>
<tr>
<td width="108" height="25" align="center" valign="middle"><a title="flash钟表" href="http://www.forasp.cn/flash.asp" target="_blank">flash钟表</a></td>
<td width="108" height="25" align="center" valign="middle"><a title="网站制作学习" href="http://www.forasp.cn/" target="_blank">网站制作学习</a><a title="威客网" href="http://www.witkeysky.com" target="_blank"></a></td>
<td width="108" height="25" align="center" valign="middle"><a title="网站制作学习" href="http://www.forasp.cn/" target="_blank">网站制作学习</a><a title="软件测试工具" href="http://www.spasvo.com/" target="_blank"></a></td>
<td width="108" height="25" align="center" valign="middle"><a title="网站制作学习" href="http://www.forasp.cn/" target="_blank">网站制作学习</a></td>
<td width="108" height="25" align="center" valign="middle"><a title="网站制作学习" href="http://www.forasp.cn/" target="_blank">网站制作学习</a><a title="河南360" href="http://www.henan360.com" target="_blank"></a></td>
<td width="108" height="25" align="center" valign="middle"><a title="网站制作学习" href="http://www.forasp.cn/" target="_blank">网站制作学习</a></td>
<td width="110" height="25" align="center" valign="middle"><a title="网站制作学习" href="http://www.forasp.cn/" target="_blank">网站制作学习</a></td>
</tr>
<tr>
<td width="108" height="25" align="center" valign="middle"><a title="flash钟表" href="http://www.forasp.cn/flash.asp" target="_blank">flash钟表</a></td>
<td width="108" height="25" align="center" valign="middle"><a title="网站制作学习" href="http://www.forasp.cn/" target="_blank">网站制作学习</a><a title="威客网" href="http://www.witkeysky.com" target="_blank"></a></td>
<td width="108" height="25" align="center" valign="middle"><a title="网站制作学习" href="http://www.forasp.cn/" target="_blank">网站制作学习</a><a title="软件测试工具" href="http://www.spasvo.com/" target="_blank"></a></td>
<td width="108" height="25" align="center" valign="middle"><a title="网站制作学习" href="http://www.forasp.cn/" target="_blank">网站制作学习</a></td>
<td width="108" height="25" align="center" valign="middle"><a title="网站制作学习" href="http://www.forasp.cn/" target="_blank">网站制作学习</a><a title="河南360" href="http://www.henan360.com" target="_blank"></a></td>
<td width="108" height="25" align="center" valign="middle"><a title="网站制作学习" href="http://www.forasp.cn/" target="_blank">网站制作学习</a></td>
<td width="110" height="25" align="center" valign="middle"><a title="网站制作学习" href="http://www.forasp.cn/" target="_blank">网站制作学习</a></td>
</tr>
</table></td>
</tr>
</table>
你会看到的效果 是: 网站制作学习网的顶部代码页面
最后是网站呢的底部
<table width="760" border="0" align="center" cellpadding="0" cellspacing="0" style="margin-top:5px;">
<tr>
<td width="759" align="center" style="line-height:20px;">页面执行时间:15.625毫秒 | <a href="online.asp" target="_blank">在线</a>:20 今日:3519  <a href="tongji.asp" target="_blank">合计</a>:2146787  网站统计 <a title="51.la 专业、免费、强健的访问统计" href="http://www.51.la/?001548351" target="_blank"></a><a href="http://www.51.la/?1548351" target="_blank"></a>|  <a title="网站制作学习网备案" href="http://www.forasp.cn" target="_blank">[冀ICP备08000199号]</a> <br />
站长联系: QQ419018470   邮箱  luuijie123#163.com   CopyRight 2008 © 网站制作学习网<br />
QQ群:36279071  站长承接各种大中小网站制作建设 Asp Asp.net Php Jsp 均可,有意请联系站长</td>
</tr>
</table>
你会看到的效果 是: 网站制作学习网的顶部代码页面

上一节,页面其他组成     回到从零学网站制作列表 网站制作学习网