妙用dw图层与表格进行网页布局
作者:赵广复 来源:赛迪网 发布时间:2009-07-14 21:57:00
使用图层可以像素为单位精确定位页面元素,并且可以将层放置在页面的任意位置。当把页面元素放入图层之中时,还可以控制哪个显示在前面、哪个显示在后面、哪个显示、哪个隐藏,可见,层的优点是很明显的。但是目前浏览器只有4.0以上的高版本才支持层,考虑到兼容性和修改时的方便,一般可在编辑网页时采用层布局或者部分页面采用层布局,而在发布网页时再将其转换为表格布局。
下面以Dreamweaver 4.0为例介绍图层与表格的相互转换操作。
将表格转换为图层
将表格转换为图层是为了调整网页布局时方便,具体操作步骤如下:
1、选中页面中欲转换为层的表格。
2、单击菜单“Modify/Convert/Tables to Layers”,在弹出的对话框(如图1)中选择想要的选项。
Prevent Layer Overlaps | 防止层重叠 | 选择此项可以在建立、移动层和调整层大小时防止层互相重叠。 |
Show Layer Palette | 显示层面板 | 选择此项,在转换完成后显示层面板。 |
Show Grid | 显示网格 | 选择此项,在转换完成后显示网格。 |
Snap to Grid | 吸附到网格 | 选择此项,可借助网格来定位层。 |
3、单击OK按钮开始转换。
图层转换为表格
把图层转换为表格是为了与低版本的浏览器兼容,操作步骤如下:
1、选中页面中欲转换为表格的层。
2、点击菜单“Modify/Convert/Layers to Table”,在弹出的对话框(如图2)中选择想要的表格布局选项。
Most Accurate | 最精确 | 为每一层建一个表格单元,以及为保持层与层之间的间隔建立附加单元格。 |
Smallest:Collapse Empty Cells | 最小:压缩单元格 | 指定如果n个层被定位在指定像素数之内,这些层的边缘应该对齐(选择此项生成的表格空行,空列最少)。 |
Use Transparent GIFS | 使用透明的GIF图像 | 用透明的GIF图像填充表格的最后一行,这样可确保表格在所有浏览器中的显示相同。若选择此项,将不可能通过拖动生成的表格的列来改变表格的大小;不选择此项,转换成的表格中不包含透明GIF图像。 |
Center on Page | 在页面上居中 | 使用生成的表格在页面上居中对齐。如果不选择此项,表格左对齐。 |
Layout区域各选项的含义同图1。
3、单击OK按钮开始转换。
转换时需注意的问题
1、将表格转换为图层时,空的表格单元不转换,表格之外的内容也被置于层中。
2、因为表格单元不会重叠,所以Dreamweaver不会把重叠的层转换为表格。如果计划把一个文档中的层转换为表格,就要在建立、移动层和调整层大小时防止层发生重叠。
3、要防止层重叠,可在层面板中选择Prevent Overlaps选项。但如果是在建立了重叠层之后才选择了此选项,不会改变以前发生的层重叠,此时只有通过移动层的方法把重叠的层分开。
4、即使选择了防止层重叠选项,有些操作也会使层发生重叠。比如使用插入菜单插入层,在属性检查器中输入层边距等。总之,如果发生了层重叠,就要在文档窗口拖动重叠的层,使它们分离开来。
在设计网页时,为使页面布局整齐、美观,需要对网页中元素进行定位。在Dreamweaver中,除了可以使用表格对页面元素进行定位之外,还有一种新的网页元素定位技术,那就是使用图层。
猜你喜欢
- 长话短说,看这个 form 元素:<form method="post" action=&qu
- Set objTextStream=FileSystemObject.CreateTextFile(Filename,[Overwrite]
- 2天内的现实new文字 <%if DateDiff("d",rs("date"),date()
- 今天看到的这篇文章, 让我对Chrome能够带来的影响,有了点新想法。Update: 发现我在跟别人讨论时,比直接写作文说得清楚一些,对这个
- 在处理css的机制上,IE总是有很多让人吐血的举动,但对于他们现在的改进力度还是值得高兴的。就拿对伪类:hover的支持来说,IE7+终于添
- 无论安装何版本的mysql,在管理工具的服务中启动mysql服务时都会在中途报错。内容为:在 本地计算机 无法启动mysql服务 错误106
- 如何在聊天室实现趣味答题并计分功能?这个创意确实很好,我们可用在聊天室框架中加入一隐含帧(5分钟刷新一次)的做法来实现这一功能。questi
- 本文通过实际业务系统中调整的一个案例,试图给出一个常见CPU消耗问题的一个诊断方法.大多数情况下,系统的性能问题都是由不良SQL代码引起的,
- 一.设置客户端网络实用工具点击“开始”-“程序”,在“Microsoft SQL Server”菜单中选择“客户端网络实用工具”。在“别名”
- 内容摘要:现在InterNet 越来越成为生活中不可或缺的一部分,制作网页的动态语言也越来越多,主要流行的有以下几种,ASP,PH
- 上一篇:微软建议的ASP性能优化28条守则(8)技巧 28:阅读资源链接下面是一些与性能有关的出色的资源链接。如果您想了解有关信息,请阅读
- 如何在ADO中客户端利用好缓存技术?具体应用见下例:global.asa< !--METADATA TYPE=&q
- 最近Google Code推出了一个面向网站开发者的 * Google DocType。它来自于网站开发者同时又面
- 昨天在书友会上讨论信息分类和方法,有位朋友问:“大家现在讨论的还是几年前那套web2.0的东西,有没有一些新的东西可以分享?”我当时确实感觉
- 报表服务器数据库可以为一个或多个报表服务器实例提供内部存储。因为报表服务器数据库架构可能会因为推出新的 Reporting Services
- 内容摘要:一堆数据摆面前,数据背后有什么样的事情在发生,这些数据里面暗藏着什么样的用户需求,什么样的商业机会?看懂这些,将为未来产品设计的方
- SQL语句优化的原则:◆1、使用索引来更快地遍历表缺省情况下建立的索引是非群集索引,但有时它并不是最佳的。在非群集索引下,数据在物理上随机存
- 删除单条记录 代码如下:id = saferequest("id") sql="
- 【原文地址】 Tip/Trick: Supporting Full Screen Mode with Silverlight 【原文发表日期
- 使用SQL SERVER的[导入]功能,便可将access数据转换,但要注意原来的'自增字段'需要修改,将相应字段标识修改为