表格排版及链接的使用——排出工整的索引板式
一、关于表格表格是最常用的排版工具,用其可以进行帖子页面的布局优化。
①首先我们来说下论坛自带的表格工具,如下图
其中,“百分比”是指表格占帖子页面的宽度,100是全宽,50就是表格只有内容页面的一半宽;
边框颜色和背景颜色可以使表格凸显出来,也可以使表格隐藏只显示其中的内容,只要将边框和背景都调成白色就行了。
用这种这种表格只能做出简单的“田字格”型表格,每行每列都是对齐的。是不是觉得不够过瘾不够炫?那么往下看。
②手动调整——代码高手的专利
在帖子编辑器的右上角有这个按钮,你是否使用过呢?
其实这个就是“直观效果和代码界面间转换”的按钮了,只要勾选上这个,我们编辑仪的内容就会以Wind代码的形式显示,这时就可以使用代码对内容进行细节调整了。
弊端是“非高手不能熟练驾驭”(关于Wind代码可以查阅相关教程)
是不是还是没法做出满意的表格和布局?那你以诋毁喜欢上下面这种方法的
③实用的其他工具——word是个好帮手
其实有很多工具可以帮助我们快捷方便的实现表格的绘制,其中最常见的就是Microsoft Office 办公组。
这部分我们将重点讲解
file:///C:/DOCUME~1/HSY~1.XYT/LOCALS~1/Temp/msohtml1/01/clip_image002.jpg以Microsoft Office Word 2003为例,分别是“绘制表格和边框”、“快速插入表格”。
file:///C:/DOCUME~1/HSY~1.XYT/LOCALS~1/Temp/msohtml1/01/clip_image004.jpg我们可以先快速建立一个表格框架
file:///C:/DOCUME~1/HSY~1.XYT/LOCALS~1/Temp/msohtml1/01/clip_image006.jpg然后使用绘制工具进行调整,如:插入一整行整列、擦除某段边框等。
表格制好后,我们就可以选取表格复制——粘贴进论坛了。这时在变革中填充内容后发表就会按着表格的布局表现了。
(注意:某些论坛由于核心代码兼容的原因会出现无效代码,所以在表格发表后需手动删除这些代码。发表后表格为透明色,想编辑颜色的就在论坛新建一个表格,代码模式中其头部就是样式代码
file:///C:/DOCUME~1/HSY~1.XYT/LOCALS~1/Temp/msohtml1/01/clip_image008.jpgfile:///C:/DOCUME~1/HSY~1.XYT/LOCALS~1/Temp/msohtml1/01/clip_image010.jpg
代码意思
[宽度30%,白色底,红色边框,边框宽度3像素])
file:///C:/DOCUME~1/HSY~1.XYT/LOCALS~1/Temp/msohtml1/01/clip_image012.jpg
下面我们就可以在表格中添加内容了。(套用一个现成的表格样式)
二、关于索引中的链接
“插入链接和取消链接”按钮
插入方法:
先输入文字,然后框选主要加链接的内容,点击“插入链接”按钮,在地址栏输入网址,点“提交”即可
效果如:“爱在咸阳”骑单车、晒甜蜜赢钻戒大奖
=====================华 丽 的 分 割 线===================== 关于超链接的字体格式:①请在链接地址添加后进行颜色、大小、字体等编辑,否则可能会是格式丢失②不要在链接添加后修改内容,否则可能丢失链接③图片也可添加链接,框选图片后添加方法同文字的添加方法
将表格和链接结合,就成了一个不错的索引贴了<div> <br /><table border=\"1\" cellpadding=\"0\" cellspacing=\"0\" bordercolor=\"#666666\">
<tbody><tr>
<td colspan=\"3\" valign=\"top\" bgcolor=\"#660033\"><p align=\"center\"><span style=\"color:#FFFFFF;\">本页索引</span></p></td>
</tr>
<tr>
<td width=\"218\" rowspan=\"3\" valign=\"top\"><p><img src=\"http://www.xianyuwang.com/p_w_upload/photo/Mon_1103/19_1d6a13009340724184ef3d4ca9cfa.gif\" width=\"220\" height=\"220\" /></p></td>
<td width=\"220\" valign=\"top\"><p align=\"left\"> <strong>一、关于表格</strong></p></td>
<td width=\"219\" valign=\"top\"><p align=\"center\"><a href=\"http://www.xianyuwang.com/read.php?tid=55615&displayMode=1#tpc\" target=\"_blank\">1L</a></p></td>
</tr>
<tr>
<td width=\"220\" valign=\"top\"><p align=\"left\"> <strong>二、关于索引中的链接</strong></p></td>
<td width=\"219\" valign=\"top\"><p align=\"center\"><a href=\"http://www.xianyuwang.com/read.php?tid=55615&displayMode=1#134980\" target=\"_blank\">2L</a></p></td>
</tr>
<tr>
<td width=\"220\" valign=\"top\"><p align=\"center\"><a href=\"http://www.xianyuwang.com/\" target=\"_blank\"><img src=\"http://www.xianyuwang.com/p_w_picpath/jafish/logo.png\" width=\"198\" height=\"80\" border=\"0\" /></a></p></td>
<td width=\"219\" valign=\"top\"><p align=\"center\">点击logo</p>
<p align=\"center\">回首页</p></td>
</tr>
<tr>
<td colspan=\"3\" valign=\"top\"><p align=\"center\">将表格和链接结合,就成了一个不错的索引贴了</p></td>
</tr>
<tr>
<td valign=\"top\" bgcolor=\"#000000\"><div align=\"center\"><span style=\"color:#FFFFFF;\"><a href=\"http://www.xianyuwang.com/t2\" target=\"_blank\">谈天说地</a></span></div></td>
<td valign=\"top\" bgcolor=\"#000000\"><div align=\"center\"><span style=\"color:#FFFFFF;\"><a href=\"http://www.xianyuwang.com/t8\" target=\"_blank\">全民乱拍</a></span></div></td>
<td valign=\"top\" bgcolor=\"#000000\"><div align=\"center\"><span style=\"color:#FFFFFF;\"><a href=\"http://www.xianyuwang.com/t122\" target=\"_blank\">游山玩水</a></span></div></td>
</tr>
<tr>
<td valign=\"top\" bgcolor=\"#000000\"><div align=\"center\"><span style=\"color:#FFFFFF;\"><a href=\"http://www.xianyuwang.com/t88\" target=\"_blank\">兴趣爱好</a></span></div></td>
<td valign=\"top\" bgcolor=\"#000000\"><span style=\"color:#FFFFFF;\"> </span></td>
<td valign=\"top\" bgcolor=\"#000000\"><span style=\"color:#FFFFFF;\"> </span></td>
</tr>
<tr>
<td valign=\"top\" bgcolor=\"#000000\"><span style=\"color:#FFFFFF;\"> </span></td>
<td valign=\"top\" bgcolor=\"#000000\"><span style=\"color:#FFFFFF;\"> </span></td>
<td valign=\"top\" bgcolor=\"#000000\"><span style=\"color:#FFFFFF;\"> </span></td>
</tr>
</tbody></table>
</div> 我还是没看懂。 认真学习了 学习了。
页:
[1]