当前位置: 主页->网页制作->Dreamweaver->DreamWeaver 2004打造留言本(3)
栏目导航
网页制作
  网页技巧
  Dreamweaver
  Frontpage
  HTML
  CSS
  Javascript
  ASP
  PHP
  JSP
  CGI
  多媒体
相关文章
◇DW行为体验
◇Macromedia 插件管理器
◇网页多幅图片显示妙法
◇用DW设计限时自动关闭
◇用DW创建导航条和状态栏
◇用Dreamweaver批量做网页
◇Dreamweaver鲜为人知……
◇Dreamweaver精彩技巧二则
◇漂浮广告代码分析
◇用DW MX控制页面元素
◇ 如何制作会移动的广告条
◇ Dreamweaver制作浮动广告
◇ 在DW中插入背景音乐方法
◇ 在主页制作连续背景音乐
◇ DW中网页折叠菜单的制作
◇ 如何在网页中加入菜单
◇ 网页菜单详解
◇ 用DW制作活动菜单条
◇ DW中网页滑动菜单的制作
◇ DW MX制作导航下拉菜单
◇ DW 2004打造留言本
◇ 会移动的文字(Marquee)

DreamWeaver 2004打造留言本(3)

http://www.yy0736.com  加入日期:2004-10-31 点击数:

[大字体 中字体 小字体]

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

是不是觉得很难看?没关系,现在我们用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里的文件代码如下:


[img]http://www.blueidea.com/articleimg/2003/11/1298/39.gif[/img]

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

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


blueidea.com/articleimg/2003/11/1298/42.gif

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

共3页 1 2 3

作者:佚名  来源:不详  

   

上篇:Dreamweaver中插入FLASH参数详解 下篇:DreamweaverMX制作导航下拉菜单


[夜鹰论坛] [我要留言] [关闭窗口] [ ][TOP]