《网页设计三剑客基础练习典型案例第4章.ppt》由会员分享，可在线阅读，更多相关《网页设计三剑客基础练习典型案例第4章.ppt（13页珍藏版）》请在taowenge.com淘文阁网|工程机械CAD图纸|机械工程制图|CAD装配图下载|SolidWorks_CaTia_CAD_UG_PROE_设计图分享下载上搜索。
1、第第4章章 使用层和框架布局页面使用层和框架布局页面 在制作网页时，使用层可以精确定位页面中的元素。用户不仅可以在层中插入网页中的内容，而且可以方便地移动层达到移动网页内容的目的，这是其它布局工具所不及的地方。除此之外，还可以使用框架来划分网页的布局。根据网页中的不同内容，使用框架把文档窗口分成几个小窗口。在每个窗口中，分别显示不同的内容。12本章学习目标：创建层将层转化为表格运用层创建动画创建与保存框架设置框架中的链接34.1 创建层创建层 层是在网页设计过程中用来放置页面元素的容器，使用层可以自由地控制网页元素的精确位置。我们来为层做一个比喻：如果在一张桌子写上字、画上画，那么要把它们挪动
2、到另一个地方，得擦掉原来写上去的字和画。44.1.1 创建与设置层创建与设置层将光标放置在要插入层的地方，然后单击【插入】【布局对象】【层】命令。在【插入】工具栏的【布局】选项卡中，单击【描绘层】按钮，然后将鼠标移动到【文档】窗口，当指针变成“”形状时，按下鼠标拖动至合适位置，释放鼠标即可。54.1.2 认识层面板认识层面板 【层】面板是文档中层的可视图，可以控制文档中的所用层。单击【窗口】【层】命令或者按下F2键，都可以打开如图4-2所示的【层】面板。在【层】控制面板中，【层】是按照堆栈的方式管理【文档】窗口中的所有层。64.2 应用层应用层 在设计网页时，必须对页面元素进行定位，使页面布局
3、整齐、美观。层就是一种新的网页元素定位技术，把页面元素放入层中可以以像素为单位精确定位页面元素。层可以放置在页面的任意位置。，可以控制某个层显示在前面，还是后面，是显示，还是隐藏。配合时间轴的使用，可同时移动一个或多个层，轻松制作出动态效果。4.2.1 转化层为表格转化层为表格 我们制作网页当然希望能支持各类浏览器，以便向更多的浏览者传递我们的信息，尽管层定位网页的元素比使用表格定位方便了很多，但并不是所有的浏览器都支持层，仅以IE浏览器而言，只有IE4.0以上的浏览器才支持层，因此有的时候我们为了兼顾各类浏览器，就只有采用表格的形式。784.2.2 Z轴的概述与应用轴的概述与应用 Z轴确定层
4、的z轴（即堆叠顺序）。在浏览器中，编号较大的层出现在编号较小的层的前面。值可以为正，也可以为负。当更改层的堆叠顺序时，使用【层】面板要比输入特定的z轴值更为简便。4.3 创建并设置框架创建并设置框架 框架由框架集和框架两个部分组成。框架集是在一个文档内定义一组框架结构的HTML网页。框架集定义了页面显示的框架数、框架的大小、载入框架的网页源和其他可以定义的属性等。单个框架是指在网页上定义的一个区域。4.4 设置框架和框架集的属性并创建设置框架和框架集的属性并创建链接链接 框架属性确定框架集内各个框架的名称、源文件、链接、边距、滚动、边框和能否调整大小。每个框架和框架集都有自己的属性检查器，通过
5、使用属性检查器来修改其属性。框架集属性控制着框架的大小和框架之间边框的颜色和宽度，以及打开链接的目标框架窗口等。除此之外，还可以在指定的框架中打开链接文件。10 4.4.1 设置框架的属性设置框架的属性 使用框架属性检查器可以查看和设置框架属性，包括命名框架、设置边框、链接和边距等，方法是：选择一个框架，然后单击【窗口】【属性】命令，打开如图4-36所示的属性检查器。单击属性检查器右下角的扩展箭头，可以查看框架的所有属性。114.4.2 使用普通链接使用普通链接 如果希望选择一个框架的内容，另一框架的内容也跟着更新，可以通过创建链接来控制框架的显示内容。使用属性检查器的【目标】列表框，在弹出的菜单中指定被链接的文件。124.5 框架标记框架标记 页面所有框架标记需要放在一个HTML的文档，这个档案只记录了该框架如何分割，不会显示任何资料，所以不必放入标记，浏览这框架必须读取这个HTML文档页面，而不是其他框架窗口的页面。13