《网页开发工具》第七讲层和框架.ppt

《《网页开发工具》第七讲层和框架.ppt》由会员上传分享，免费在线阅读，更多相关内容在行业资料-天天文库。

1、第七讲层和框架《网页开发工具》第七讲层和框架7.1层在以前的网页中，元素是无法重叠出现的，除非将重叠的元素制作成背景图像，而有了层以后，就可以将元素放置在层中，因为层可以重叠，所以也就产生了许多重叠的效果。在层中可以放置文字、图像、插件或其他层，层可以放在网页的任意未知，并且可以移动和隐藏。当在一个页面上创建多个层时，可以将这些层产生平铺、重叠或嵌入的效果。所谓平铺式层，是指绘制的多个层之间没有重复交叠，平铺在页面上。在层的面板中选中“放置重叠”复选框即可。重叠式层正好与平铺式层相反，即多个层之间是相互重复交叠的。嵌

2、入式层是指新建的层包含在其他层（父层）中，移动父层时子层也随之移动，而移动子层时父层却不会移动。当光标放置在父层中，使用平铺式层或重叠式层的方法都可以创建嵌入式层。《网页开发工具》第七讲层和框架7.1.1层的种类方法一：使用“插入”面板打开“插入面板”，选择“布局”选项卡，直接将“绘制层”按钮拖到页面中。方法二：使用菜单命令单击“插入”

3、“层”命令，就可以插入一个层了。方法三：插入多个层按住Ctrl键的同时，单击“插入”面板上的“绘制层”按钮，可在页面中一次插入多个层。《网页开发工具》第七讲层和框架7.1.2插入层并

4、设置属性《网页开发工具》第七讲层和框架多个层的插入及排列操作步骤如下：1)单击“编辑”

5、“首选参数”命令，选择分类列表中的“层”选项，对层的参数进行设置。2)选择插入面板中布局选项卡的“绘制层”按钮，按住Ctrl键，画出四个层。3)按住shift键同时单击各个层，可同时选中多个层。单击“修改”

6、“排列顺序”命令，再选择“对齐上缘”、“设成宽度相同”、“设成高度相同”命令，可对多个层进行排列。4)如果想将多个层的间距设置为等距，选中任意一个层，在层的属性面板中对“左对齐”参数进行设置即可。1)层的缩放：单个层的缩放只需

7、拖拽缩放手柄（层周围出现的小方块）即可；如果是多个层，则先同时选中多个层，然后在属性面板的“宽”

8、“高”中输入以像素为单位的数值就可以对多个层进行统一的调整。2)层的移动：通过鼠标拖动进行，也可通过上下左右四个方向键进行。按一次方向键，层移动一个像素位置；按住shift键再按方向键则一次移动10个像素位置。3)层的对齐：选中多个层，单击“修改”

9、“排列顺序”中的左对齐、右对齐等方式即可。《网页开发工具》第七讲层和框架7.1.3层的操作(缩放移动对齐改变Z轴顺序等)4)改变层的可见性：单击“窗口”

10、“层”命令打开

11、层面板，单击眼睛图标可以修改层的可见性；在层的属性面板中将可见性参数选为hidden，也可将层设为不可见。5)层的Z轴顺序：Z轴值最大的层在最上面，在层面板中拖动层或是在属性面板中输入Z轴数值都可以改变层的Z轴顺序。例：阴影文字制作。6)层的嵌套：将光标置于一个层内，再继续插入一个层，就得到了嵌套层。子层与父层的Z轴顺序是一样的，父层移动时子层也将移动，而子层移动时父层不会移动。嵌套层之间存在继承的关系(inherit)，即子层的可见性和父层保持一致以及保持与父层的相对位置不变。《网页开发工具》第七讲层和框架《网页开

12、发工具》第七讲层和框架7.1.4层与表格的相互转换1.层到表格：层能够精确定位页面元素，在定位完成后可以将层转换为表格，以免在低版本的浏览器中不能精确显示页面。插入层后，单击“修改”

13、“转换”

14、“层到表格”命令，在打开的对话框中设置有关表格的参数，点击确定按钮即可。《网页开发工具》第七讲层和框架参数说明如下：最精确：将所有层转换为表格，如果层之间有间距，则插入适当的单元格。最小：如果层之间的距离很小，会将这些层转换为相邻的单元格，可以在后面的文本框中输入层之间的最小距离，单位为像素。使用透明GIF：将转换后的表格最后

15、移行填充为透明的GIF图像，这样在所有的浏览器中，表格后具有相同的显示效果，此时不能拖动表格的边框来改变表格的大小。置于页面中央：转换后的表格在页面中居中对齐，否则居左对齐。《网页开发工具》第七讲层和框架2.表格到层布局时使用表格灵活性要受到一定的限制，如果要改变网页中各元素的布局，需要将表格转换为层，然后通过移动层来改变网页的布局。选中表格，单击“修改”

16、“转换”

17、“表格到层”命令，在出现的对话框中设置完毕，单击“确定”按钮，表格就转换为层了。在一个网站中，通常会有许多元素重复地出现在不同的网页文档中，如网页标题、

18、导航栏等。如果在每个网页都添加这些相同的部分，就会浪费很多的时间，而访问者在浏览网页时也要付出重复的等待时间。使用框架将很好的解决以上问题。框架将显示窗口划分成许多子窗口，每个窗口内显示独立的文档，当浏览一个网页时，网页的某部分区域（如标题或导航栏）的内容不变化，而其他区域不断地更新。《网页开发工具》第七讲层和框架7.2框架当一个页面被划分为若