dw两个表格并排Word下载.docx

dw两个表格并排Word下载.docx

《dw两个表格并排Word下载.docx》由会员分享，可在线阅读，更多相关《dw两个表格并排Word下载.docx（5页珍藏版）》请在冰豆网上搜索。

　　在“属性选择器”中，选择dir右边的下拉箭头。

　　rtl：

内容从右向左排列

　　篇二：

如何用dw创建表格

　　一、创建基本的表格

　　一个表由＜table＞开始，＜/table＞结束，表的内容由＜tr＞,＜th＞和＜td＞定义。

＜tr＞说明表的一个行，表有多少行就有多少个＜tr＞；

＜th＞说明表的列数和相应栏目的名称，有多少个栏就有多少个＜th＞；

＜td＞则填充由＜tr＞和＜th＞组成的表格。

　　表格重要的基本标记不多，但每个标记都有很多的属性，考虑到一下子把这些属性都列出来，可能让初学者感到无从下手，所以我们还是从表格的外观（即浏览器中显示的表格的样式）来了解最基本的属性。

　　在讲解之前，我们先来看看表格的基本构造。

下图是一个3行3列的表格。

　　这里面有两个概念要弄明白：

表格与单元格。

他们的关系是整体与局部的关系，如同砌墙的砖和砌好的墙一样。

在上面3行3列的表格中一共有9个单元格。

由于我们后面将提到的表格属性和单元格属性有很多是相同的，所以一定要分清楚。

前面已经说过表格的最基本标记为＜table＞、＜tr＞、＜td＞，可以先树立这样一个概念：

描述整个表格的属性标（dw两个表格并排）记放在＜table＞里，描述单元格的属性标记放在＜tr＞、＜td＞里。

有这样一个概念后，我们学习起来就可能简单些。

　　1、表格、单元格的大小,表格边框的宽度、颜色,单元格边框的颜色

　　表格以及单元格的大小是用“width=#”和“height=#”属性说明，“width=#”表示宽，“height=#”表示高，，#是以象素或者百分比为单位的数字。

表格边框的宽度是用

　　“border=#”属性说明，，#为宽度值，单位是象素，表格边框的颜色是用“bordercolor="

#"

属性说明，#是16进制的6位数，格式为rrggbb，分别表示红、绿、兰三色的分量。

或者是16种已定义好的颜色名称，参见文本颜色，单元格边框的颜色属性与表格的相同，但只适用于ie。

下面是一个宽为300,高为80,边框宽为4,边框颜色为“FF0000”的一行两列表格，其中第一个单元格的宽为200,高为80，第二个单元格的边框颜色为“0000FF”。

　　代码如下：

　　＜tableborder="

4"

width="

300"

height="

80"

bordercolor="

#FF0000"

＞

　　＜tr＞

　　＜tdwidth="

200"

＞＜/td＞

　　＜tdbordercolor="

#0000FF"

　　＜/tr＞

　　＜/table＞

　　2、表格的水平摆放位置

　　表格的水平摆放位置是用align="

属性说明的，#为left（左对齐）,right（右对齐）,

　　第三个表格的代码如下：

　　＜tablewidth="

border="

1"

align="

right"

30"

　　＜td＞右对齐＜/td＞

　　3、单元格里内容的位置属性

　　水平对齐方式，用align="

属性说明，#为left（左对齐）,right（右对齐）,center（居中）；

垂直对齐方式，用valign="

属性说明，#为top（上对齐）,bottom（下对齐）,middle（居中）。

分别见下例，注意单元格里的内容与边框的的位置关系：

450"

150"

　　＜divalign="

left"

＞内容左对齐＜/div＞

　　＜/td＞

center"

＞内容居中＜/div＞

　　＜td＞

＞内容右对齐＜/div＞

　　垂直对齐方式

　　＜tdheight="

40"

146"

valign="

top"

＞内容上对齐＜/td＞

middle"

＞内容居中＜/td＞

bottom"

＞内容下对齐＜/td＞

　　4、表格的背景色、背景图片，单元格的背景色、背景图片

　　背景色属性：

bgcolor="

，背景图片属性：

background="

。

#539996"

#FFFFFF"

90"

＞＜tr＞

　　＜td＞＜/td＞

　　＜tdbackground="

back01.gif"

　　＜tdbgcolor="

　　说明：

在上例中，整个表格的背景色是bgcolor="

，第一行第二列的单元格背景图片是background="

，第三行第二列的单元格背景色是bgcolor="

根据显示结果可以看出：

设置表格的背景色后再设置单元格的背景色或背景图片，将优先显示单元格的属性。

　　5、表格属性cellspacing、cellpadding

　　cellspacing属性用来指定表格各单元格之间的空隙。

此属性的参数值是数字，表示单元格间隙所占的像素点数。

　　我们来看下面的两个表格：

　　上面第一个表格的单元格之间没有空白距离，而第二个的单元格之间有很大的空白距离，我们来比较一下他们的源代码：

　　第一个表格的代码：

cellspacing="

0"

#000000"

　　第二个表格的代码：

8"

　　比较代码，上边两个表格中只有cellspacing的设置不同，一个为“0”，一个为“8”，显示的结果就是第一个表格的每个单元格之间的距离为0（在本例中由于我们为了显示的方便，将表格边框设为“1”，所以单元格的真实距离是“2”，若将表格边框设为“0”，则单元格的距离就是0了，第二个单元格同理），第二个表格的每个单元格之间的距离为8。

　　cellpadding属性用来指定单元格内容与单元格边界之间的空白距离的大小。

此属

　　性的参数值也是数字，表示单元格内容与上下边界之间空白距离的高度所占像素点数以及单元格内容与左右边界之间空白距离的宽度所占的像素点数。

我们先来看看这个例子:

　　我们来看下面两个表格：

　　第一个表格单元格的内容与单元格边界之间没有空白距离，而第二个表格单元格的内容与单元格边界之间有空白距离，我们来比较一下他们的源代码：

240"

cellpadding="

０"

120"

＞网页陶吧＜/td＞

15"

　　两个表格只有红色部分代码不同。

第一个表格中"

网页陶吧"

这几个字离它所在的单元格为0,那是因为设置了cellpadding

　　="

的原因.第一个表格中的"

这几个字离它所在的单元格比较远，那是因为cellpadding="

也就是说"

离它所在的单元格的边界的距离为20像素。

简单的说,cellpadding的值等于多少,那表格内的单元格从自身边界开始向内保留多少空白,单元格里的元素永远都不会进入那些空白里。

　　我们在以后的篇幅中会大量用到这两个属性，所以请大家不要弄混乱了,为了形象的理解，请参考下图：

　　篇三：

在dreamweaver中制作细线表格

　　制作细线表格

　　如果仅仅是定义表格的边框为1（border="

）和边框颜色值（如bordercolor="

），表格线其实是2px的，要做细线表格，有2种方法：

　　方法一

　　1、插入表格，参数设置如下图（边框：

0单元格填充：

0单元格间距：

1）：

　　2、选中表格，在属性面板中设置表格的背景颜色为黑色：

　　3、全选所有单元格（光标定位到第一个单元格里，按住shift键单击最后一个单元格，）然后在属性面板中设置所有单元格的背景颜色为白色：

　　4、完成后效果如图：

　　当然，表格边框和单元格的颜色也可以设置为其他颜色，但是不能是同一种颜色。

　　方法二

　　1、插入表格，参数设置：

边框：

1

　　单元格填充：

　　单元格间距：

　　2、点击“窗口/标签检查器”，打开标签面板，设置“浏览器指定”：

　　bordercolordark：

白色（#FFFFFF）

　　bordercolorlight:

：

黑色（#000000）

　　3、完成后如图：