当前位置:迷你小窝窝/网页制作/Dreamweaver网页制作/层和表格的转换及实例操作

 

 

一、层转换为表格

使用层创建布局,将层转化为表格,可以使布局在低版本的浏览器中进行查看。

要将层转换为表格,操作方法如下:

  1. 新建文档,建3个以上层,为方便浏览,各层加上不同的背景颜色。
    如样例1所示
  2. 移动层并选中任意图层,使几个图层无重叠部分。
  3. 执行“修改”“转换”“层到表格”命令,弹出下面的“转换层为表格”对话框,根据需要进行设置,然后点确定。



转换效果如样例2所示,为区别表格和整个网页,分别加了背景色。

选项说明:

  • 最精确:为每个层创建一个单元格,并附加保留层之所必须的任何单元格。
  • 最小:合并空白单元:指定如果层定位在指定数目的像素内,则层的边缘应对齐。选择此选项,结果表格将含较少的空行和空列。
  • 使用透明GIF:用透明的GIF填充填充表的最后一行,这将确保该表在所有浏览器中以相同的列宽显示。
  • 置于页面中央:将转换后的结果表放置在页面的中央。
 

二、表格转换为层

将表格转换为层,操作方法如下:

  1. 新建一个表格,确认准备转换为层的单元格不是空单元格,或单元格已经有了背景色。
  2. 执行“修改”“转换”“表格到层”命令,弹出下面的“转换层为表格”对话框,根据需要进行设置,然后点确定。

选项说明:

  • 防止层重叠:在创建、移动层和调整层大小时约束层的位置,使层不会重叠。
  • 显示网格、和靠齐到网格:能够使用网格来协助将层定位。
 

三、让层在浏览器居中显示的技巧

通常通过建立2个父子层实现,父层上、左取50%,使父层左上角位于浏览器中间,子层坐标是以父层为参考点的,如一个400px*200px的层想要位于浏览器中间,只需设子层械-200px,上-100px即可。

例见样例3

三、层设计实例操作

以菜谱介绍、花卉介绍或动物介绍为题,实现如课本P84实例类似的层设计页面。