您现在的位置是: 网站设计 ->设计教程 ->网页设计 ->Dreamweaver ->
本文关键字: dreamweaver
Google
 
Dreamweaver MX 2004打造留言本
作者: 开心 | 发布时间: 2008-06-08 19:05 | 信息类别: Dreamweaver | 访问人次:
评论 推荐 打印 编辑 】 【 关闭
  

  


保存所有修改,在IE中输入 http://localhost/guestbook/index.asp (或者http://localhost/guestbook/ )看看你的成果:


是不是觉得很难看?没关系,现在我们用CSS和图片简单修饰一下。

按"Shift+F11"展开CSS面板,点击图30中的加号按钮


在弹出的"New CSS Style"对话框中作如图31设置后单击"OK",出现一个让你选择可在CSS文件的对话框,这里我们就保存为css.css(图32)



之后在弹出的"CSS Style Definition for body in css.css"对话框中作如下两步设置:



保存css.css,可以明显的看到现在的index.asp好看多了,不过我们的美化页面工作还没完成,继续定义链接的CSS----单击图30中的加号按钮,在弹出的"New CSS Style"对话框中作如图35设置,单击"OK"按钮,再设置(图35)



刚才定义的是正常状态和点击之后的链接,现在再定义一下鼠标移上时的链接状态:



保存css.css,刷新浏览器中index.asp页,看看效果----好象还少点东西,表格线不是网上常见的那种细线,对不对?好,我们现在就开始打造细线表格。用DW打开css.css,在最后加上代码:

.thin {
    border-collapse: collapse;
}
现在css.css里的文件代码如下:


然后给需要做细线的表格(表格一、表格二、表格四和表格五)的table标签里加上class="thin",给表格二、表格四和表格五的table标签里加上frame="void",完成后代码大概如图40,在IE中看的效果如图41所示:


注意,这种方法制作的细线表格,必须保证有class="thin"、border="1"和bordercolor="#666666"(边框颜色,可以选择自己喜欢的颜色)三个属性,并且只适用 于IE5.0+。
最后是给几个单元格加上背景图片和背景颜色,完成后在IE中的效果如图所示:


至此,显示留言页(index.asp)的前台部分全部完成

『相关链接』
序号
标题 发布日期
1
2008-06-08 19:05:04
2
2008-06-08 19:05:04
3
2008-06-08 19:05:04
4
2008-06-08 19:05:04
5
2008-06-08 19:05:04
6
2008-06-08 19:05:04
7
2008-06-08 19:05:04
8
2008-06-08 19:05:04
9
2008-06-08 19:05:04
10
2008-06-08 19:05:04
    查看所有相关的信息...
【郑重声明】【上海IT外包服务网】 刊载此文不代表同意其说法或描述,仅为提供更多信息,也不构成任何投资或其他建议。转载需经作者本人同意并注明出处。本网站有部分文章是由网友自由上传。对于此类文章本站仅提供交流平台,不为其版权负责。如果您发现本网站上有侵犯您的知识产权的文章,请发信至 或直接电话联系: 021-58879030
请您留言
『发表评论』
匿名发表 会员ID: 密码:

上海蝶应信息科技有限公司
上海市商城路341号紫光大厦1305室 +0086-21-58878998 11394019
dieying@541help.com +0086-21-58879030HappyFreeAngel@hotmail.com
Copyright@2007 IT-WAIBAO.COM Inc.沪ICP备05039378号 版权所有2007-2010 管理员登陆