63表格代码基础.ppt

《63表格代码基础.ppt》由会员上传分享，免费在线阅读，更多相关内容在应用文档-天天文库。

1、先区分“表格”和“单元格”。6.3关于表格的基础知识及基础代码在dreamweavercs3中插入普通表格的两种方法：一，在“设计”视图下使用常用工具栏的相关按钮插入表格。二，在“代码”视图下编写代码进行表格的制作。一，在“设计”视图下使用常用工具栏的相关按钮插入表格。方法：一，单击常用工具栏按钮，继续单击“插入表格”图标，如图所示：这个位置：常用工具—表格图标由第一步可得到如下“表格”对话框。假设我们要在网页中插入一个两行四列的表格，我们可将行数设置为2，列数设置为4，如左图所示，该表格的宽度为400px,当然这里我们也可以设置为“

2、百分比”。关于“百分比”我们稍后讨论。点击“确定”按钮后我们可得到如下所示的表格。以上是所生成的2行4列的表格，同时请同学们仔细查看该表格的“属性”面板，红色框所框区域是我们必须要熟练掌握的。填充属性英文：cellpadding间距属性英文：cellspacing边框颜色属性英文：bordercolor背景颜色属性英文：background-color或：bgcolor背景图像属性英文：Background-image或：background对齐属性英文：align(这里指水平方向的对齐）边框属性英文：border类属性英文：clas

3、s下面请看老师的演示，学会分辨上述“属性”面板的几种属性，并能熟练使用这些属性，对表格进行相关设置。通过老师的讲解，上述几种属性总结如下：1，如果只设置该表格的边框为“1”，并设置边框颜色为黑色，将得到如下图所示效果：边框（border)值：1边框颜色（bordercolor)属性值：黑色该效果说明：当表格边框不为0,，并且没有设置”间距“属性时，所得到的表格会有内外两层边框。外侧边框内侧边框2，可以通过“属性”面板将该表格的内外两层边框设置为不同的颜色，如下图所示效果：选中整个表格时，弹出的“属性”面板状态，此时，“边框颜色”属性指

4、的是整个表格最外侧的边框的颜色。在某一个单元格内单击鼠标所弹出的属性面板状态，此时，“边框”属性的颜色是某一个单元格内侧边框的颜色。单元格边框，即内侧边框整个表格的边框，即外侧边框“填充”(cellpadding)和“间距”（cellspacing)属性的不同效果。通过观看老师的操作演示，同学们要明确“填充”属性的效果和“间距”属性的效果的不同之处，完全区分开两者，并能熟练掌握。相关具体知识点请同学们自己练习。表格的对齐方式（表格的对齐包含两部分）一，整个表格的对齐方式（整个表格的英文为：table).注：当我们单击整个表格时，所弹出

5、的属性面板中只显示“对齐”属性，如下图所示：由上图所示，对于整个表格来说，它只能在水平方向进行对齐设置，分别为：左对齐（left)，居中对齐(center)，右对齐(right)。表格的左对齐方式表格的居中对齐方式表格的右对齐方式二，表格中每一个单元格的对齐方式注：当我们在表格中的某一个单元格内单击一下鼠标后，“属性”面板将变为如下图所示的状态：由左图所示，对于表格内的每一个单元格来说，它可以在水平方向和垂直方向上进行对齐设置，水平方向上：左对齐（left)居中对齐(center)右对齐(right)垂直方向上顶端对齐(top)纵向居

6、中对齐(middle)底端对齐(bottom)网页中表格的基本代码