1、7.1 层的创建 7.2 层的选择 7.3 设置层属性 7.4 设置层的顺序 7.5 层的显示和隐藏 7.6 层大小的调整 7.7 层的移动 7.8 层的对齐 7.9 层与表格的相互转换 7.10 层的应用实例 使用辅助工具精确定位网页元素,第7章 层及其应用,网页一般可用层(Layer) 、表格(Table) 和框架(Frame)来对网页元素定位。,层是网页中用来放置文本、图像、动画、表单、插件等网页元素的载体。层在Dreamweaver 网页编辑区中可以自由移动，改变层在网页中的位置，便可实现层中网页元素位置的改变。实际上，层的应用技术也是一种网页元素的定位技术，利用层能够精确对页面元素定
2、位。设计者可以控制多个层的叠放次序，显示或隐藏层。层与时间轴配合使用，可以很方便地设计出动态页面效果，层与行为配合使用，还可以很方便地制作出滚动字幕、下拉式菜单等页面效果。,创建普通层使用菜单命令创建层 将光标放在要创建层的位置 选择“插入”|“布局对象”|“层”命令，即可在插入点所在位置插入一个默认大小的层。,7.1层的创建,使用鼠标拖动的方法绘制层 打开布局选项卡(布局面板/布局栏),单击“绘制层”按钮 。 在文档窗口中按下鼠标并拖动，松开鼠标后即绘制出层。 按住Ctrl键，一次绘制多个层。,通过拖动按钮创建层 将“布局” 选项卡中的“绘制层”按钮 从面板中拖到文档窗口中，松开鼠标即可在插
3、入点所在位置插入一个默认大小的层。,“编辑”|“首选参数”,创建嵌套层将光标放在已建立层的内部，然后选择“插入”|“布局对象”|“层”菜单命令插入层，插入后该层即为嵌套层。使用拖动的方法，在“布局”选项卡上按住“绘制层”按钮拖动到一个已经建立的层的内部，则新建立的层即嵌套层。使用绘制层的方法创建嵌套层，单击“布局”选项卡中的“绘制层”按钮，然后在层的内部绘制层。是否需要按Alt键？,嵌套层嵌套层的子层可以在其父层中间，也可以在其父层外边，嵌套层永远在其父层上方。对于普通层而言，它的层标记将依次出现。,选中一个层单击文档窗口中的层标记单击层中的任意位置来激活层，然后单击层左上角的选择手柄单击层边
4、框，即可选中该层在没有层被激活或被选中的情况下，按住Shift键，再单击层中任意位置，也可选中该层；直接在层面板上单击层名称，在文档窗口中会选中相应的层。,7.2 层的选择,选中多个层 按住Shift键，再在每个要选中的层中单击鼠标，可选中多个层。 按住Shift键，再在层面板中单击两个或多个层的名称，可选中多个层。,图1 被激活的层,图2 被选中的层,7.3 设置层属性,层的默认属性 在菜单栏中选择“编辑”|“首选参数”命令，在弹出的“首选参数”对话框中选择左侧“分类”列表中的“层”，对话框右侧就会出现与层相关的参数。,Default(默认状态)， Inherit(继承父层的可见性)， Vi
5、sible（设置层为可见）， Hidden（设置层为隐藏）,使用绘制层的方法创建嵌套层，单击“布局”选项卡中的“绘制层”按钮，然后在层的内部绘制层。是否需要按Alt键？,确定当层的内容超出层范围时处理的方式。 Visible（增加层尺寸，显示超出部分的内容）， Hidden（保持层尺寸不变，隐藏超出部分的内容）， Scroll（增加滚动条）， Auto（当内容超出层尺寸时，自动增加滚动条）,层“属性”面板 用户可在“层”属性面板上分别对每个层或多个层进行设置。,Default(默认状态)， Inherit(继承父层的可见性)， Visible（设置层为可见）， Hidden（设置层为隐藏）,设
6、置当前层的名称。层名称中不能带有符号和汉字，也不能以数字开头，只能是英文字母和数字。,在【Z轴】文本框中，可设置当前层在层重叠中的顺序，z值大的在上面。,设置当前层相对于页面或父层的左上角距离。,“层”面板,层的重叠顺序,跳整层的可见性 （默认为可见）,防止层重叠,调整层嵌套 在层面版中：按住Ctrl键+拖动层,方法有两种： 通过层的“属性”面板; 通过“层”面板.,7.4 设置层的顺序,7.5 层的显示和隐藏,7.6 层大小的调整,选中层后，在“层”属性面板上的“宽”和“高”文本框中可以直接设置层大小。 选中层，把鼠标放到边框上的控制点时，拖动层边框上的箭头，即可在相应方向上改变层大小。 如
7、果希望将层的大小每次改变1像素的距离，则可以按住Ctrl+方向键，每按一次方向键，即可在相应方向上改变1像素的距离。,7.7 层的移动,通过选中层，在“层”属性面板中的“左”和“上”文本框中输入相应的数值，即可改变它在页面中的位置。 选择一个层（或按住Shift键，用鼠标选择多个层），拖动并移动到需要的位置。 选择一个层，用方向键以1像素为单位移动层。,7.8 层的对齐,7.9 层与表格的相互转换,将层转换为表格选择“修改”|“转换”|“层到表格”命令 将表格转换为层选中表格，然后选择命令“修改”|“转化”|“表格到层”。,层的对齐方式，包括左对齐、右对齐、对齐上缘和对齐下缘等。,设置层的对齐方法是:选中层，选择“修改”|“排列顺序”命令，打开相应的子菜单，然后选择对齐方式即可。,7.10 层的应用实例,使用辅助工具精确定位网页元素,当页面内容越来越复杂时，尤其使用了大量图片时，页面内容的精确定位就会成为一个大问题，Dreamweaver 8提供了相当丰富的页面内容功能来解决这个问题，比如使用辅助线、视图的缩放工具和使用视图的选取工具等。,1垂直辅助线 2水平辅助线 3缩放和选取工具,Thanks,to be continued,&,
