教你Dreamweaver中框架的使用技巧
在Dreamweaver中应用框架是非常容易的事情,下面我们就来看看具体的应用。
增加新框架
要给框架页面增加新框架,就是像拆分表格的单元格一样,把一个框架分为两个框架。
其操作如下:
(1)按住Ctrl键,将鼠标放在框架边框上,当鼠标变为上下箭头时,可把边框拖到一个新位置,当松开鼠标按钮时,一个新的空白内容的框架就形成了。
(2)也可以通过命令来操作:首先单击要拆分的框架内部,选“框架”菜单中的“拆分框架”命令,在弹出的“拆分框架”对话框中单击“拆分成列”或“拆分成行”单选按钮,单击“确定”按钮即可。
删除框架
若框架页面看起来太乱,可删除某些框架。
要删除一个框架,可先单击该框架选择它,再选择“框架”菜单中的“删除框架”命令即可。
改变框架属性
在设置好框架的整体布局后,我们还可以对每一框架的具体属性进行设置,操作如下:(1)单击需设置属性的框架,选择“框架”菜单中的“框架属性”,则弹出“框架属性”对活框。
(2)在对话框的“名称”文本框中可输入框架名,这样便于识别不同的框架;在“选项”区域中,若选中“在例览器中可以调大小”复选框,则客户在浏览站点时,可重新定义框架尺寸,通过在“显示滚动条”下拉列表框中选择不同的描述项,可设置让滚动条是否出现。
(3)在“框架大小”区域中,可设置框架大小,可以定义一个绝对像素值或相对于浏览器窗口的百分比,若要用浏览器来设置相对于该页面中框架的尺寸,可选“相对”;在“边距”区域中,可设置内容页面与框架边框分隔的像素数值。
(4)要改变开始页面,可以在“初始网页”文本框中输入一个新的页面名字或URL。
(5)单击“框架网页”按钮,则弹出“网页属性”对话框。
(6)在该对话框的“框架”选项卡中,在“框架间距”文本框中,可输入以像素为单位的边框宽度;若要使框架边框消失,则不要选中“显示边框”复选框。
(7)单击“确定”按钮,关闭“网页属性”对话框,再单击“确定”按钮,关闭“框架属件”对话框,完成框架属性设置。
Dreamweaver怎么创建框架结构?dw设置框架结构的教程
Dreamweaver怎么创建框架结构?dw设置框架结构的教程
2、如何进⼊框架的编辑呢,如果你的⼯作区不是“经典”,那就切换过来,在右上⾓的位置。
这样⽅便找到布局,当然你还可以在“修改”选项中找到框架。
我们就以“经典”⼯作区进⾏编辑。
3、单击框架右下⾓的⿊⾊三⾓形,就出现许多种框架格式,我们选择“顶部和嵌套的左侧框架”,当然你可以根据实际需要选择。
这种框架也是⽐较常⽤的。
4、选择“顶部和嵌套的左侧框架”后会出现⼀个对话框,如果没有修改的必要,那就选择默认的就⾏,单击“确定”,对框架进⾏编辑。
5、如果在右侧没有显⽰框架的窗⼝,那么可以在“窗⼝”选项中打开框架窗⼝,这对于我们后来的编辑很有好处,你也可以直接按"shift+f2"快捷键打开。
6、我们可以对框架进⾏各种编辑,如修改边框颜⾊和宽度。
在刚刚打开的框架窗⼝⾥单击需要编辑的那⼀层的边框,或者直接单击编辑窗⼝⾥的框架边框,不过通常前者更加⽅便和直观。
这样做之后,会出现下⾯的属性。
我们就可以进⾏各种编辑了。
7、因为框架每⼀个框都是⼀个独⽴的⽹页,所以保存的时候要特别注意,不仅需要保存每个⽹页⽂件,还得保存边框的结构。
⽐如说刚刚我建⽴的哪个框架,需要保存四个⽂件。
以上就是dw设置框架结构的教程,希望⼤家喜欢,请继续关注。
上⼀页1 2下⼀页阅读全⽂。
dreamweaver框架的属性制作
dreamweaver框架的属性制作1、框架的属性先单击菜单window|frames(窗口|框架),打开框架浮动东西栏。
单击最外边框架边线。
框架属性东西栏的参数为:borders:有无边框---除了NO之外都有;bordercolor:边框颜色;borderwidth:边框粗细,单位为像素。
row:当为上下支解时,此字母为行高;当左右支解时,此字母为列宽,单位为像素、百分比或相对其他框架。
一样通常环境下,上、左框架用像素牢固。
框架的边线的有无,根据计划要求选择。
2、框架的再支解和删除①方法一先单击欲再支解的框架单位,单击菜单插入|框架,在此中选择所需的支解方法即可,尔后根据上述方法举行设置。
②方法二先单击欲再支解的框架,单击菜单修改|框架设置,此中有5个选项:editnoframescontent、splitframeleft、splitframeright、splitframeup、splitframedown。
③方法三先选中欲再支解的框架,再将鼠标移到左右框架的最外边框线上,当出现时,拖动鼠标向页内移动,到符合的位置放手就行了。
此方法最为简朴。
删除框架比力简朴,只需拖动欲删除的框架线,到窗口之外或与相邻框架线重合后放手,此框架就删除了。
3、框架的巨细可以拖动框架的边框直接调解,较好的方法是:对框架接纳输入数值的方法。
4、非框架页的编辑选择editnoframescontent将弹出一个空缺窗口,可以举行行与一样通常网页一样的编辑制作,所编辑的内容在支持框架页的欣赏器中不行见,而会在不支持框架的欣赏器中表现。
发起正规网站应该制作此页。
5、框架的生存单击菜单文件|生存全部的框架,弹出生存对话框,起首是生存框架阐明页,尔后是一个一个的框架页,dreamweaver会在打开生存对话框的同时,在编辑窗口中表示欲生存的谁人框架页,根据计划要求定名存盘即可。
Dreamweaver浮动框架
Dreamweaver浮动框架浮动框架是一种特殊的框架页面,在浏览器窗口中可以嵌套子窗口,在其中显示页面的内容。
浮动框架可以插入在页面中的任意位置。
浮动框架需要用手写代码的方式来实现。
1、浮动框架基本原理及使用方法如果需要在页面中创建一个浮动框架,需要先制作好页面的其他内容,再在页面中以手写代码的方式插入浮动框架的代码,浮动框架的代码如下所示。
<IFrame src="File-URL" HEIGHT=value width=value NAME="IFRAME-name"Align="value"></IFrame>其属性含义如下:SRC:浮动框架中显示页面的源文件的路径和文件名。
Width:浮动框架的宽度。
Height:浮动框架的高度。
Name:浮动框架的名称。
Align:浮动框架的排列方式,可以取三个值:Left (表示居左)、Cener(表示居中)、Right(表示居右)。
FrameBorder:框架边框显示属性(同普通框架)。
FrameSpacing:框架边框宽度属性(同普通框架)。
Scrolling:框架滚动条显示属性(同普通框架)。
NOResize:框架大小调整属性(同普通框架)。
BorderColor:框架边框颜色属性(同普通框架)。
MarginWidth:框架边缘宽度属性(同普通框架)。
MarginHeight:框架边缘高度属性(同普通框架)。
2、浮动框架的链接在浮动框架中,也可以制作页面之间的链接。
创建链接的方式同样是先用name属性为浮动框架命名,再将链接的目标浏览器窗口指向命名的浮动框架。
只是指向目标的时候,不能可视化操作,需要编写代码执行例如:建立浮动框架网页(1)在“xin126”文件夹下创建网页文件“xin126.html”。
(2)在网页中插入浮动框架,代码如下:<IFrame src="index.htm" HEIGHT=800 width=800 NAME="xin126"Align="center">表示在页面中插入一个宽800,高800,框架名为“xin126”,居于浏览器中间对齐的浮动框架。
Dreamweaver CS6-第6章使用框架课件
6.1.4 保存框架
保存框架时,分两步进行,先保存框架集,再保存框架。 1.保存框架集和全部框架 2.保存框架集文件 3.保存框架文件
6.1.5 框架的选择
在对框架或框架集进行操作之前,必须先选择框架或框架集。 1.选择框架 2.选择框架集
6.1.7 拆分框架
通过拆分框架,可以增加框架集中框架的数量,但实际上是在 不断地增加框架集,即框架集嵌套。拆分框架有以下几种方法。
(1)先将光标置于要拆分的框架窗口中,然后选择“修改 > 框架集”命令,弹出其子菜单,其中有4种拆分方式。
(2)选定要拆分的框架集,按Alt+Shift组合键的同时,将鼠 标指针放到框架的边框上,当鼠标指针呈双向箭头时,拖曳鼠标指针 拆分框架。
在Dreamweaver CS6中,可以利用可视化工具方便地创建框架集。用户 可以通过菜单命令,实现该操作。
1.通过“插入”命令建立框架集 2.通过拖曳自定义框架
6.1.3 为框架添加内容
因为每一个框架都是一个HTML文档,所以可以在创建框架后,直接编 辑某个框架中的内容,也可在框架中打开已有的HTML文档,具体操作步骤 如下。
1.给每一个框架定义标题 2.创建框架中的链接
6.2.5 改变框架的背景颜色
通过“页面属性”对话框设置背景颜色的具体操作步骤如下。 (1)将插入点放置在框架中。 (2)选择“修改 > 页面属性”命令,弹出“页面属性”对话框,单击 “背景颜色”按钮 ,在弹出式颜色选择器中选择一种颜色,单击“确定” 按钮完成设置
6.1.8 删除框架
将鼠标指针放在要删除的边框上,当鼠标指针变为双向箭头时,拖曳 鼠标指针到框架相对应的外边框上即可进行删除。
Dreamweaver教程:操作框架
Dreamweaver教程:操作框架
本文介绍操作框架的一些方面:拆分框架,查看和设置框架集属性,设置链接的目标框架。
拆分框架
1.在框架页面中,将插入点放在边框上,出现双向箭头。
2.拖动边框,产生一个新的框架文件。
3.在属性面板上,为新框架命名,并且点击“浏览文件”,选择一个文件作为框架的“源文件”。
4.选择“文件”>“保存全部”。
注:要使用不在“设计”视图边缘的框架边框拆分一个框架,在按住 Alt 键的同时拖动框架边框。
查看和设置框架集属性
选择“窗口”>“其他”>“框架”,打开“框架”面板。
在“框架”面板中单击环绕框架集的边框,选中框架集。
在属性面板上,选中框架区,然后修改框架集属性。
使用类似的方法修改框架文件的属性。
设置链接的目标框架
在框架页面中选择一个链接,在“目标”弹出式菜单中,选择链接的文档应在其中显示的框架或窗口。
_blank 在新的浏览器窗口中打开链接的文档,同时保持当前窗口不变。
_parent 在显示链接的框架的父框架集中打开链接的文档,同时替换整个框架集。
_self 在当前框架中打开链接,同时替换该框架中的内容。
_top 在当前浏览器窗口中打开链接的文档,同时替换所有框架。
如果链接需要在框架页之外打开,使用target="_top" 或target="_blank"。
DreamWeaver第四章-层和框架
2021/8/2
9
层和表格的转换
❖层可以随便移动 ❖层转换成表格
“修改/转换/层到表格”
2021/8/2
10
层和表格的转换
❖“修改/转换/表格到层”
2021/8/2
11
练习
❖当将鼠标指针划过一个植物的图像时, 显示一个层,在该层中显示该植物的生 长季节和地区、需要多少阳光、可以长 到多大等详细信息。
要在一个框架中使用链接以打开另一框架中 的文档,用户必须设置连接目标
Target
➢_blank, _parent, _self, _top,……
2021/8/2
27
•_blank 在新的浏览器窗口中打开链接的文档,同时保持当 前窗口不变。
•_parent 在显示链接的框架的父框架集中打开链接的文档, 同时替换整个框架集。
•_self 在当前框架中打开链接,同时替换该框架中的内容。 •top 在当前浏览器窗口中打开链接的文档,同时替换所有框 架。
2021/8/2
28
❖ 替换框架文件
“文件/在框架中打开”——选择html文件
用框架面板替换框架文件
❖ 保存框架和框架集文件
框架集文件——“untitledframeset-?.html”
2021/8/2
12
创建和使用框架
❖框架与框架集的概念 ❖创建框架与框架集 ❖选择框架与框架集的方法 ❖设置框架与框架集的属性 ❖使用链接控制框架内容 ❖保存框架与框架集文件 ❖解决浏览器无法显示框架的问题
2021/8/2
13
框架与框架集
❖ 框架可以用来划分网页,是不同的文件可以载 入不同页面的定义区域中。框架是一种先进的
拖动边框不能完全删除一个框架集
项目十一 Dreamweaver 框架的应用
知识技能目标
知识讲解
课堂实践
项目总结
上一页
下一页
项目十一 框架的应用
课程引导
知识讲解
8.调整各框架区域的大小 根据需要通过拖动相邻框架之间的边框线调 整各个框架域的大小,使页面整体效果协调、 整各个框架域的大小,使页面整体效果协调、 美观。 美观。 9.设置超级链接
知识技能目标
知识讲解
课堂实践
项目总结
知识技能目标
知识讲解
课堂实践
项目总结
上一页
下一页
项目十一 框架的应用
课程引导
知识讲解
4.分割框架和调整框架的大小 (1)显示框架边框 (2)显示框架面板 (3)分割框架 (4)调整框架的大小 (5)删除框架
知识技能目标
知识讲解
课堂实践
项目总结
上一页
下一页
项目十一 框架的应用
课程引导
知识讲解
6.保存框架集和框架 预览或者关闭包含有框架的网页文档时, 预览或者关闭包含有框架的网页文档时,必须先 对框架集文件和框架文件进行保存。创建框架时, 对框架集文件和框架文件进行保存。创建框架时, 默认的框架集文件名称是UntitleFrameset UntitleFrameset默认的框架集文件名称是UntitleFrameset-1、 UntitleFramesetUntitleFrameset-2、……,默认的框架文件名 , 称是UntitleFrame UntitleFrame- UntitleFrame称是UntitleFrame-1、UntitleFrame-1、……。 。 显然,这样的命名是不合适,必须重新重名。 显然,这样的命名是不合适,必须重新重名。
知识技能目标
知识讲解
dreamweaver怎么设置边框 dreamweaver怎么新建框架集文件
Dreamweaver怎么设置边框在Dreamweaver中,您可以使用CSS样式或HTML属性来设置元素的边框。
边框可以为页面增添装饰性,也可以用于区分不同的元素。
下面将介绍一些方法来在Dreamweaver中设置边框。
1. 使用CSS样式设置边框步骤 1:打开Dreamweaver首先,打开Dreamweaver并加载您要编辑的HTML文件。
步骤 2:选择要设置边框的元素使用鼠标点击或选择器选中您想要设置边框的元素。
您可以选择一个div、一个图片或者任何其他标签。
步骤 3:添加CSS样式在Dreamweaver的右侧面板中,点击“CSS样式”来显示CSS样式面板。
确保您已经链接了CSS样式表。
步骤 4:创建一个新的样式表如果您没有创建过样式表,请点击样式面板上的“新建样式表”按钮。
如果您已经有样式表了,请跳过此步骤。
在样式表面板中,点击“新样式”按钮来创建新的样式。
在“名称”字段中输入一个名称以识别样式。
添加以下代码来设置边框样式:.element {border-style: solid; /* 设置边框样式为实线 */border-width: 1px; /* 设置边框宽度为1像素 */border-color: black; /* 设置边框颜色为黑色 */}可以根据需要自定义边框的样式、宽度和颜色。
步骤 6:应用样式选中您要应用样式的元素,然后在样式表面板中找到您刚刚创建的样式并选择应用。
2. 使用HTML属性设置边框在Dreamweaver中,您也可以使用HTML属性来直接设置元素的边框。
步骤 1:选择要设置边框的元素使用鼠标点击或选择器选中您想要设置边框的元素。
在元素标签中添加以下属性来设置边框样式、宽度和颜色:```html <div style=。
DREAMWEAVERcs6模块6使用AP元素与框架
模块六---使用AP元素和框架
任务二 框架使用
子任务1 框架和框架集的工作方式 框架的作用就是把浏览器窗口分割成若干个区域,每个区域可以分别显示不 同的网页内容。框架最常见用途就是导航,应用框架在制作一些功能性比较 强的网页时有很大的优势,例如现在的一些网站的管理后台,都是用框架来 制作的,这样操作方便,不用每次单击链接都刷新整个网页。 Dreamweaver可以在一个“文档”窗口中查看和编辑与一组框架关联的所 有文档。每一框架会显示一个单独的 HTML 文档。 框架创建和框架集创建的过程是同步的,只要创建了框架就创建了框架集, 有了框架集就必然存在框架。如果某个页面被分成两个框架,那么它实际是 由一个框架集和两个框架而组成的。使用框架的最常见情况就是:一个框架 显示包含导航控件的文档,而另一个框架显示包含内容的文档。如果一个站 点在浏览器中显示为包含三个框架的单个页面,则它实际上至少由四个 HTML 文档组成:框架集文件以及三个文档,这三个文档包含最初在这些框 架内显示的内容。在 Dreamweaver 中设计使用框架集的页面时,必须保存 所有这四个文件,该页面才能在浏览器中正常显示。
模块六---使用AP元素和框架
子任务2 框架和框架集的使用
1 .创建框架和框架集可以使用以下操作方法。 步骤 1 启动Dreamweaver,将插入点放在文档中并执行下列操作之 一:
选择【插入】→【HTML】→【框架】,并选择预定义的框架 集;
在“插入”面板的“布局”类别中,单击【框架】按钮上的下 拉箭头,然后选择预定义的框架集。框架集图标提供应用于 当前文档的每个框架集的可视化表示形式。框架集图标的蓝 色区域表示当前文档,而白色区域表示将显示其它文档的框 架。
模块六---使用AP元素和框架
用Dreamweaver建立框架页面
实验8 用Dreamweaver建立框架页面实验目的:通过实验,掌握如何如何创建和应用框架页面,了解框架的基本分布结构和各个框架页面之间的相互联系。
实验步骤:1. 启动Dreamweaver程序,选择菜单“文件”“新建”命令,打开“新建文档”对话框。
在对话框中“常规”标签下选择“类别”列表中的“框架集”选项,然后再右边的“框架集”列表中选择“上方固定”选项,如图8-1所示。
单击“创建”按钮创建框架网页。
2. 选择菜单“窗口”“框架”命令,打开框架控制面板。
3. 用鼠标单击框架控制面板中的下部分,选中mainFrame框架。
如图8-2所示:图8-1 套用框架图11-2 选择框架集的子框架4. 将鼠标放在选中的边框上,使鼠标变成双向箭头,然后拖动鼠标将该框架分成左右两个子框架。
如图8-3所示。
图8-3 把主框架切分为子框架5. 在框架编辑窗口中,单击顶部框架,选择菜单“文件”→“保存框架”命令,保存框架为top.htm页面。
6. 将光标停放到下部分框架的左边框家中,选择菜单“文件”→“保存框架”命令,保存框架为left.htm页面。
7. 按同样的方法,将右边的框架保存为right.htm页面。
8. 单击框架面板上最外层的边框,或单击页面编辑窗口中的最外层边框,使外框出现虚线。
如图8-4所示:图8-4选中整个框架说明鼠标单击所选中的框架,所选中的框架就是当前正在编辑的页面.9. 选择菜单“文件”—>“保存全部”命令,保存所有框架和框架集,框架集文件名称为index.htm.如图8-5所示.10. 单击框架面板上的topFrame框架,选中top.htm网页.11. 打开属性面板,在属性面板上的“滚动”下拉菜单中选择“否”,图8-5 保存框架集然后勾选旁边的“不能调整大小”复选框;在“边界宽度”和“边界高度”的文本框中都输入0,参数设置如图8-6所示.图8-6 top框架的属性设置说明框架属性面板上的“滚动”下拉菜单中有“是”.“否”.“自动”.和“默认”四项,其中选择“是”表示允许页面左右.上下出现滚动条;选择“自动”.“默认”表示根据网页内容,需要时自动显示滚动条;选择“否”表示不允许出现滚动条.12. 单击top框架页面,在属性面板中单击“页面属性”按钮。
