当前位置: 首页 > 图文教程 > 网页制作 > Dreamweaver > 用Dreamweaver MX轻松操作表格

Dreamweaver
用代码“写”出扫描线效果图片
DHTML实例解析:用HTC统一定制表单样式
网页瘦身小技巧---“分割大法”
简单实用的网页表格特效
巧用样式表,让文本框与按钮变个样
网页工作原理
网页图片特效小技巧
如何防止及消除垃圾代码的产生
提高页面显示速度的秘技
用DW MX制作导航下拉菜单
Dreamweaver MX应用表格排序
Dreamweaver查找替换的技巧
用DreamWeaver定制网站的颜色
Dreamweaver MX进阶教程(七)创建基于框架的网页
Dreamweaver MX进阶教程(九)使用用于框架的“行为”
Dreamweaver MX进阶教程(八) 操作框架
Dreamweaver MX进阶教程(十)制作居中的网页
Dreamweaver MX进阶教程(十六)制作可拖动表格
Dreamweaver MX进阶教程(二十一)制作虚线
Dreamweaver MX进阶教程(十三)在Dreamweaver 中使用上标和下标

用Dreamweaver MX轻松操作表格


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-11-23   浏览: 66 ::
收藏到网摘: n/a

网页制作中是免不了与表格打交道的。表格是网页制作的基础,在网页布局中起着举足轻重的作用,熟练掌握表格的操作,是你制作网页的辅路石,也是你成为“织网高手”的敲门砖。

一、调整表格的尺寸

1、等比例调整行、列的宽度

选定表格,在表格的右边框、底边框及右下角各出现三个黑色方块,称为选择手柄,拖动选择手柄即可调整表格的大小,此时表格的行或列宽度等比例调整。

2、设置行、列的宽度

如图1所示,如果要实现第一行行高的增加,可采取如下三种方法实现:

(1) 同的表格操作相似,向下拖动表格中两行间的边框来增加行高;

(2) 选中第一行即①、②两个单元格,在单元格属性面板的“H”域中输入某一数据如30,如图2所示,行高增加;

(3) 只选中第一行中①或②中一个单元格,执行第二种方法操作。

上面三种方法虽然实现了同样的目的,但分析它们的源代码是不同的。

第一、 二两种方法的源代码是:

< tr>
  < td height="30"> < /td>
  < td height="30"> < /td>
  < /tr>

而第三种方法的源代码是:

< tr>
  < td height="30"> < /td>
  < td> < /td>
  < /tr>

比较发现前两种方法比第三种方法源代码中多了height="30",这多出的height="30"称为垃圾代码,会增大网页文件的大小,这在网页制作中是禁止出现的。

由此得出在调整行、列宽度时使用第三种方法效果最佳,虽然通过拖动边框更方便行、列宽度的调整,但这属于“违法”行为。

如果你已经实施了前两种方法,产生了大量的垃圾代码,如何解决呢?

3、清除多余行高或列宽

既然产生了垃圾代码,那么进入代码编辑窗口中将垃圾代码删除就可以了,不过还有更快捷的方法:选中表格,单击表格属性面板中的“清除行高”与“清除列宽”两个按钮可迅速将垃圾代码删除,如图3所示。

    

提示:慎用“清除列宽”按钮,应用之后会使表格宽度减小,影响网页的布局等。

二、插入行或列

1、利用属性面板。

选中表格,在表格属性面板中”Rows“域中输入大于现有行数(如3)的数值,如5,则表格在其下方将插入2行(5-3=2),若输入的数值小于3如2,则在表格中将删除一行。如图4所示。插入或删除列的操作同样。

2、利用快捷键。

利用属性面板插入行或列只能在表格的底部或右端进行操作,如果要在任意位置进行,使用快捷键即可。“Ctrl+M”快捷键可在当前行上方插入一行,而按下快捷键“Ctrl+Shift+A”可在当前列前插入一列。

3、利用复制操作。

选中一行或多行,选择右键菜单的“拷贝”命令,再单击右键菜单