在Dreamweaver中巧用框架建立网站

dreamweaver

本文选自4u2v工作室编写的《Dreamweaver网页设计与制作100例》(人民邮电出版社出版,ISBN: 7115142394)。未经著作权所有者书面授权许可,禁止转载本文。

购买地址:点击访问

有时看到一些论坛,左边是每个讨论区的名称,点击任意一个讨论区就可以在右部区域中看见相应讨论区的内容,不过左右部分是独立显示的,比如拖动左边的滚动条不会影响右侧的显示效果。其实这是在页面中利用了框架技术,因此可以把浏览器的显示空间分割为几个部分,每个部分都独立显示网页内容。而且把几个框架结合在一起构成框架集,能够让页面具有更为丰富的效果。

效果说明

先建立两个页面,分别为“ myphoto.htm ”、“ mydiary.htm ”。前一个是相册页面,后一个是日记页面。再建立一个含有框架的页面,并添加导航栏。

创作思想

打开 Dreamweaver MX 2004 软件新建两个页面,在左边输入导航文字:“网站首页、我的日记、我的相册”,在每个相对应的页面输入相对应的文字,比如网站首页链接的页面内容,就输入“我的网站首页”。再建立一个新页面,单击【布局】中的框架图标,建立左右框架,然后保存页面,在左框架建立网站导航栏,在右框架随便输入文字,接着再次保存页面。

操作步骤

( 1 )打开 Dreamweaver MX 2004 软件新建文件,具体操作如图 3-1 所示。

提示:也可使用快捷键 Ctrl + N 打开【新建文档】对话框。

( 2 )保存页面,保存时可以随意设置文件名称,比如输入“ myphoto (我的相册)”,如图 3-2 所示。

提示:也可使用快捷键 Ctrl+S 打开【另存为】对话框。

( 3 )用同样的方法新建文件,并保存页面为“ mydiary (我的日记)”。

( 4 )接着再次新建文件,在页面中创建左右框架设置参数,并在左右框架中输入相应的文字,如图 3-3 所示。

( 5 )为了方便操作,先将该页面保存为 3 个不同名称的页面,如图 3-4 所示。

图 3-4 保存全部页面

( 6 )设置页面的链接。首先设置“网站首页”链接,如图 3-5 所示。

( 7 )接着是添加“我的日记”超链接,如图 3-6 所示。

图 3-6 添加超链接( 1 )

( 8 )然后再添加“我的相册”超链接,如图 3-7 所示。

( 9 )在【文件】菜单中选择保存命令,保存全部页面,完成操作。

使用框架时,读者务必要理解好框架的构成关系,才能很好地使用和控制框架。

时间: 2024-08-19 22:21:04

在Dreamweaver中巧用框架建立网站的相关文章

Dreamweaver如何用框架建立网站

有时看到一些论坛,左边是每个讨论区的名称,点击任意一个讨论区就可以在右部区域中看见相应讨论区的内容,不过左右部分是独立显示的,比如拖动左边的滚动条不会影响右侧的显示效果.其实这是在页面中利用了框架技术,因此可以把浏览器的显示空间分割为几个部分,每个部分都独立显示网页内容.而且把几个框架结合在一起构成框架集,能够让页面具有更为丰富的效果. 效果说明 先建立两个页面,分别为" myphoto.htm "." mydiary.htm ".前一个是相册页面,后一个是日记页面

如何在Dreamweaver中嵌入式框架

dreamweaver 本文选自4u2v工作室编写的<Dreamweaver网页设计与制作100例>(人民邮电出版社出版,ISBN: 7115142394 ).未经著作权所有者书面授权许可,禁止转载本文. 购买地址:点击访问 正确使用嵌入式框架可以给网站的创建带来许多方便,比如当单击某个在线播放的 MP3 文件时,就可以使用嵌入式框架进行局部刷新. 效果说明 建立文件,以大型网站的链接作为实例,当单击链接时,该网站的内容就会出现在表格中,供用户浏览. 创作思想 打开 Dreamweaver M

ASP视频:Dreamweaver中建立站点和连接数据库

大家在初学ASP程序的时候,我们经常第一个任务就是配置环境!在这里根据网页教学网站长的经验,有时克隆版的XP系统有时是安装不了IIS的!本讲主要讲述在Dreamweaver中建立站点和连接数据库.大家请看视频教程.

用Dreamweaver快速搭建框架型网站页面

dreamweaver|页面 一. 框架介绍 框架页面是由一组普通的Web页面组成的页面集合,通常在一个框架页面集中,将一些导航性的内容放在一个页面中,而将另一些需要变化的内容放在另一个页面中.使用框架页面的主要原因我想大概是为了使导航更加清晰,使得网站的结构更加简单明了.我们看一下下面的这个网站例子,如图一所示. (图一.框架结构页面实例) 这个页面是由上中下三部分组成的一个框架集,最上面的是此站点的栏目导航,点击不同的栏目,相应的栏目内容会出现在中间的框架子页面中.最下面是此站点的一些相关信

软件Dreamweaver中的层在网站制作中作用重大

[硅谷网12月11日文]据<硅谷>杂志2012年第18期刊文,在使用Dreamweaver制作网站时候,总要用到层,因为层是一种网页元素定位技术,使用层可以以像素为单位精确定位页面元素,层可以放置在页面的任意位置.利用层可以非常灵活地放置网站内容,可以再层 里面放置文本,图像.视频等对象,甚至是其它的嵌套层.层对于制作网站的部分重叠效果更具有特殊作用,把页面元素放入层中,而已控制元素的显示顺序,也能控制是哪个显示.哪个隐藏.使网站制作工作更加高效. 关键词:Dreamweave:层:编辑:属性

在Dreamweaver中框架使用

在Dreamweaver中应用框架是非常容易的事情,下面我们就来看看具体的应用. 增加新框架 要给框架页面增加新框架,就是像拆分表格的单元格一样,把一个框架分为两个框架. 其操作如下: (1)按住Ctrl键,将鼠标放在框架边框上,当鼠标变为上下箭头时,可把边框拖到一个新位置,当松开鼠标按钮时,一个新的空白内容的框架就形成了. (2)也可以通过命令来操作:首先单击要拆分的框架内部,选"框架"菜单中的"拆分框架"命令,在弹出的"拆分框架"对话框中单击

在Dreamweaver中框架的使用一些技巧

在Dreamweaver中应用框架是非常容易的事情,下面我们就来看看具体的应用. 增加新框架 要给框架页面增加新框架,就是像拆分表格的单元格一样,把一个框架分为两个框架. 其操作如下: (1)按住Ctrl键,将鼠标放在框架边框上,当鼠标变为上下箭头时,可把边框拖到一个新位置,当松开鼠标按钮时,一个新的空白内容的框架就形成了. (2)也可以通过命令来操作:首先单击要拆分的框架内部,选"框架"菜单中的"拆分框架"命令,在弹出的"拆分框架"对话框中单击

教你Dreamweaver中框架的使用技巧

在Dreamweaver中应用框架是非常容易的事情,下面我们就来看看具体的应用. 增加新框架 要给框架页面增加新框架,就是像拆分表格的单元格一样,把一个框架分为两个框架. 其操作如下: (1)按住Ctrl键,将鼠标放在框架边框上,当鼠标变为上下箭头时,可把边框拖到一个新位置,当松开鼠标按钮时,一个新的空白内容的框架就形成了. (2)也可以通过命令来操作:首先单击要拆分的框架内部,选"框架"菜单中的"拆分框架"命令,在弹出的"拆分框架"对话框中单击

Dreamweaver中如何远程发布网站站点

本文章说明如何使用 Macromedia Dreamweaver 8 设置远程站点,以及如何发布 Web 页.远程站点通常是运行 Web 服务器的远程计算机上保存本地文件副本的位置.用户在浏览器中查看您的页时,就是在访问在 Web 服务器上运行的远程站点. 了解远程站点 创建了 Web 站点后,下一步就是通过将文件上传到远程文件夹来发布该站点.远程文件夹是存储文件的位置,这些文件用于测试.生产.协作和发布,具体取决于您的环境.Dreamweaver 将此文件夹称为远程站点. 在继续之前,您必须能