论坛表格使用指南

gxqcn

原帖由 gxqcn 于 2008-4-6 19:33 发表
合理应用表格，可使排版更整齐。
示例，可见 liangbch 写的《资料：Intel 和 AMD CPU 资料》

采用表格排版的步骤如下：

• 将排版模式切换到“所见即所得模式”（默认为“Discuz!代码模式”）
• 点击[img=http://images.5d6d.net/dz60/common/bb_table.gif]插入表格[/img]图标，输入表格的行数与列数，将得到一个空表格
• 将内容复制填充到对应单元格中

正因为表格操作是如此麻烦，所以并不推荐大家采用，除非在对对齐要求非常高的情形。

更详细的教程请见：论坛表格使用指南

这样一个最原始的表格就被制作出来了。但是怎样才能创建一个漂亮的表格呢？下文为你一一道来。

一般来说，可使用“所见即所得模式”来创建出表格的大致框架，然后使用下文提到的代码和技巧来完善整个框架，
最后回到“所见即所得模式”里输入内容，并且编辑内容的格式（如粗体、居中等等）。

1#        序+目录
2#        表格代码简介
4#        跨行与跨列
5#        表格和单元格的宽度
6#        表格和单行的背景色
7#        表格线（只限横线）加粗
8#        技巧分享

gxqcn

最简单的表格代码如下：

1. [table][tr][td]其它代码[/td][/tr][/table]

复制代码

{table}	表格开始
{tr}	行开始
{td}	单元格头
其它代码	内容
{/td}	单元格尾
{/tr}	行结束
{table}	表格结束

{table}代码的高级形式为{table=表格宽度, 表格底色}，会在下文里详细介绍。

1	2
3	4

1. 这里为了排版的好看，我在某些代码后面用硬回车来换行了，在实际使用以下代码的时候，所有硬回车都要删掉，否则会有不良效果
   
2. [table]
   
3. [tr][td]1[/td][td]2[/td][/tr]
   
4. [tr][td]3[/td][td]4[/td][/tr]
   
5. [/table]

复制代码

实例说明，一个表格以{table}开始，以{/table}结束。表格的一行以{tr}开始，以{/tr}结束，并且在其中加插{td}和{/td}来定义一个单元格。而该单元格的内容（例如实例里的＂1＂、＂２＂、＂３＂和＂４＂）则写在{td}和{/td}中间。
{tr}代码的高级形式为{tr=行背景色}
{td}代码的高级形式为{td=单元格所占列数, 单元格所占行数, 单元格宽度}
同上，{tr}和{td}代码的高级形式会在下文里详细介绍。

mathe

同HTML语法很类似，就是不知道能否自定义边框

gxqcn

在前文里提到了{td}代码的高级形式为{td=单元格所占列数, 单元格所占行数, 单元格宽度}。
“单元格所占行数”和“单元格所占列数”填入相应的正整数，以下用例子说明：

A	B
	C

1. [table][tr][td=1,2]A[/td][td]B[/td][/tr][tr][td]C[/td][/tr][/table]

复制代码

当值为“1,2”时，单元格占1列和2行，相应地，原本在第一列第二行的单元格代码需要删掉，因为此时它的位置已经被内容为“A”的单元格所占据。

D
E	F

1. [table][tr][td=2,1][align=center]D[/td][/tr][tr][td]E[/td][td]F[/td][/tr][/table]

复制代码

当值为“2,1”时，单元格占2列和1行，相应地，原本在第二列第一行的单元格代码需要删掉，因为此时它的位置已经被内容为“D”的单元格所占据。

gxqcn

设置表格宽度和单元格宽度的代码分别是：[table=表格宽度] 和 [td=单元格所占列数,单元格所占行数,单元格宽度]
用来设定宽度的数值可以是百分数（以当前页面大小的百分比来设定宽度）或者正整数（1~999，设定宽度为多少个像素；系统允许的最大像素值宽度为560，超过这个数值会自动被修改成98%）。例子：

1	2
3	4

1. 这里为了排版的好看，我在某些代码后面用硬回车来换行了，在实际使用以下代码的时候，所有硬回车都要删掉，否则会有不良效果
   
2. [table=200]
   
3. [tr][td=1,1,30%]1[/td][td=1,1,70%]2[/td][/tr]
   
4. [tr][td]3[/td][td]4[/td][/tr]
   
5. [/table]

复制代码

注意事项：
● 如果想定义在同一个竖列的单元格宽度，只要定义第一个单元格就可以了
● 如果想定义某一单元格宽度，即便未跨行或跨列，也必须在前面写明“单元格所占列数,单元格所占行数”
● 当一行的单元格的总宽度比整个表格所设定的宽度要小的时候，表格宽度 - 同一行单元格总宽度 = 该行没有设定宽度的单元格的宽度
● 当表格和单元格都没有设定宽度的时候，单元格的宽度由里面内容的长度来决定
● 表格和单元格都没有定义高度的方式，由其中的内容自动调整

gxqcn

■ Black	■ Sienna	■ DarkOliveGreen	■ DarkGreen	■ DarkSlateBlue	■ Navy	■ Indigo	■ DarkSlateGray
■ DarkRed	■ DarkOrange	■ Olive	■ Green	■ Teal	■ Blue	■ SlateGray	■ DimGray
■ Red	■ SandyBrown	■ YellowGreen	■ SeaGreen	■ MediumTurquoise	■ RoyalBlue	■ Purple	■ Gray
■ Magenta	■ Orange	■ Yellow	■ Lime	■ Cyan	■ DeepSkyBlue	■ DarkOrchid	■ Silver
■ Pink	■ Wheat	■ LemonChiffon	■ PaleGreen	■ PaleTurquoise	■ LightBlue	■ Plum	■ White

表格的默认底色为透明。

（１）整个表格的底色，方法是：
　　使用｛table=表格宽度,XXXXXX｝代码（因此设定表格底色的同时，也必须设定表格的宽度），XXXXXX可以是6位的RGB颜色代码（前面需要加上#号），也可以是论坛默认的描述颜色的英文单词（见上表）。6位的RGB颜色代码可以在开始=>附件=>画笔的编辑自定义颜色里获得。

1	2
3	4

1. 这里为了排版的好看，我在某些代码后面用硬回车来换行了，在实际使用以下代码的时候，所有硬回车都要删掉，否则会有不良效果
   
2. [table=200,#eeeecc]
   
3. [tr][td=1,1,100]1[/td][td=1,1,100]2[/td][/tr]
   
4. [tr][td]3[/td][td]4[/td][/tr]
   
5. [/table]

复制代码

（２）某一行的底色，方法是：
　　使用｛tr＝XXXXXX｝代码，XXXXXX可以是6位的RGB颜色代码（前面需要加上#号），也可以是论坛默认的描述颜色的英文单词。

1	2
3	4

1. 这里为了排版的好看，我在某些代码后面用硬回车来换行了，在实际使用以下代码的时候，所有硬回车都要删掉，否则会有不良效果
   
2. [table=200,#eeeecc]
   
3. [tr=yellowgreen][td]1[/td][td]2[/td][/tr]
   
4. [tr][td]3[/td][td]4[/td][/tr]
   
5. [/table]

复制代码

注意：
● 我们不能单独对某一个单元格设定其底色
● 表格设定底色后，内部的字体请尽量使用底色的反相色（也就是色环上对角线上的颜色，见下图）

色环

gxqcn

在需要加粗横线的部分，重复创建只有一个单元格的行，并且不要在里面填写任何内容

1	2
3	4

1. 这里为了排版的好看，我在某些代码后面用硬回车来换行了，在实际使用以下代码的时候，所有硬回车都要删掉，否则会有不良效果
   
2. [table=200,#eeeecc]
   
3. [tr=yellowgreen][td]1[/td][td]2[/td][/tr]
   
4. [tr][td=2,1][/td][/tr]
   
5. [tr][td=2,1][/td][/tr]
   
6. [tr][td=2,1][/td][/tr]
   
7. [tr][td=2,1][/td][/tr]
   
8. [tr][td=2,1][/td][/tr]
   
9. [tr][td=2,1][/td][/tr]
   
10. [tr][td=2,1][/td][/tr]
    
11. [tr][td]3[/td][td]4[/td][/tr]
    
12. [/table]

复制代码

gxqcn

表格编辑相对烦琐，不推荐使用，除非对排版效果要求很高的情况下。

● 表格代码中不要换行，除非是单元格中的内容需要换行；否则会出现不必要的回车效果

● 删除硬回车符的方法：在 UltraEdit 或 UEStudio 文字处理软件，单选表格代码，将“^p”替换为空字串

● 不要太相信点击“预览帖子”的效果（它并非提交后的最终显示效果）

原帖由 mathe 于 2008-4-13 10:10 发表
同HTML语法很类似，就是不知道能否自定义边框

似乎没有办法，但影响不大。

无心人

既然表格并没有好的编辑方法
我等愚笨之人
那只好用经典方法了
就是修改-查看-再修改-再查看
幸好有GxQ此等妙文
有一请求不知可否
能否把这个文字和那个编辑数学公式之文
在首页做下链接
俺做帖子编辑公式深知其中滋味儿
郭老大请为之解困

gxqcn

原帖由 无心人 于 2008-4-15 09:59 发表
既然表格并没有好的编辑方法
我等愚笨之人
那只好用经典方法了
就是修改-查看-再修改-再查看
幸好有GxQ此等妙文
有一请求不知可否
能否把这个文字和那个编辑数学公式之文
在首页做下链接
俺做帖子编辑公式深 ...

在各个帖子左下部会随机出现编辑数学公式及发帖技巧的链接。

我再想办法把它们再加入到上面那排菜单中，使在发主题帖时也可快速获得帮助，
这个得回家后才能调试，不大好实现。。。