教程--怎样发布使用HTML编写的帖子

天下 · 发表于 2006-12-6 13:45:31

在学习使用HTML编写帖子前，请朋友们先看看是否有“使用HTML代码”的权限。

天下 · 发表于 2006-12-6 13:57:28

谈点体会:

第一：写“回”字。
用HTML制帖，就像我们写一个“回”字，是一种单一的边框结构。我们写“回”字,按照笔划顺序来讲,该是先外边后里边吧，无论这个“口”字里有多少个“口”字，最外边的“口”先结束，最里边的最后结束。用HTML制帖，就是这个道理。等大家熟悉掌握运用这些代码后，更加复杂的布局，比如像制作一张工作人员花名册，就涉及到行<TR>.列<TD>，好像是更难一点的了，等大家熟悉运用这些代码后，自然不难了。

第二：有始有终。
用HTML制作，最重要的一点就是做到有始有终，也就是有开始必须有结束。比如<P>这个标签，它是意思是表示段落的标签代码（类似文章的换行），当一段编辑后，必需用</P>表示结束。

第三：拿来主义。
掌握并熟悉地运用HTML后，接触的帖子也多了，你会发现，每一个人有每一个人的制作方法及特点。那么，我们在欣赏别人精典制作的同时，不仿拿回家看看，该收藏的收藏，该掌握的掌握，比如素材好我们就收藏，自己做帖时可以运用，比如制作特点，方法，我们可以拿为己用，没有什么不好意思。

学习的朋友们，如果遇到疑点就跟帖，或者到菜鸟学堂相互交流，我会尽我所能为大家解答，谢谢。

夜游 · 发表于 2006-12-6 14:05:10

俺愚钝，听得一头雾水，可否请老师举例说明，俺跟着一步一步来

夜游 · 发表于 2006-12-6 14:09:30

掌握并熟悉地运用HTML不是一两天学得会的，从最简单的开始吧，搞一个会出声的图片，上面可以自己写点喜欢的字，应该从哪里入手呐？

天下 · 发表于 2006-12-6 14:13:10

对于论坛里的特效帖子，主要元素一般是5个：表格、图片、文字、FLASH、音乐。在这5个元素中，表格一般通过使用HTML代码编写后实现，文字可以编辑，也可以做在图片上。而其他的元素，一般都是通过引用的方式而不是传递在本论坛。因此，一个特效贴，我们可以理解为：我们（图片、FLASH、音乐）来自五湖四海，为了一个共同的目标（被编辑着引用）走到一起来了（通过HTML语法组成了一个画面）。

天下 · 发表于 2006-12-6 14:21:10

我们先从最基本的开始：认识代码。

1.<p>.....</p>
<p>标志对是用来创建一个段落，在此标志对之间加入的文本将按照段落的格式显示在浏览器上。另外，<p>标志还可以使用align属性，它用来说明对齐方式，语法是：<p align=center></p> align可以是Left(左对齐)、 Center(居中)和Right(右对齐)三个值中的任何一个。</p>表示标志对中的文本使用居中的对齐方式，align 表示位置。

2.<br>是一个很简单的标志，它没有结束标志，因为它用来创建一个回车换行。

3.<table>：表格的起始符。任意一个表格的开始都必须以它开头，且必须有终止符</table>。

4. <tbody>：表体的起始符。紧跟在<table>之后，表示表体开始。必须有结尾符，放在</table>之前。在纯网页中可以不要tbody元素，但在论坛一定要使用，否则，当帖子用到较多的表格时，论坛的自动填充功能将可能会导致代码出错。

5.<tr>：tr的作用是规定表格的行，其中，t是table，r是row（行）。有多少组tr，这张表格就有多少行。<tr>紧跟在<tbody>之后。必须有终止符</tr>。

6.<td>：td的作用是规定表格的列，t是table，d可理解为down（向下）。有多少组td，这张表格就有多少列。第一个<td>紧跟在<tr>之后。终止符为</td>。td与tr配合构成单元格。

</td>、</tr>、</tbody>、</table>：这些都是相应元素的终止符，表示相应元素所规范的内容结束。必须注意它们的排列顺序，不能有错。

从表格的代码框架分析得出：表格标签里，所有元素都成对出现，而这些元素是按照从大到小的顺序从外往里层层包裹的。table最大，它占在起始和终结的位置，tbody是老二，tr是老三，td最小，它在最里层。

7.border：此属性定义表格的边框。比如，border=1，表示表格边框的粗细为1个像素（默认值），为0表示没有边框。

8. cellspacing：单元格间距。当一个表格有多个单元格时，各单元格的距离就是cellspacing了，如若表格只有一个单元格，那么，这个单元格与表格上、下、左、右边边框的距离也是cellspacing。

9.cellpadding：单元格衬距。指该单元格里的内容与cellspacing区域的距离，如果cellspacing为0，则表示单元格里的内容与表格周边边框的距离。

10. width：表格的宽度。取值从0开始，默认以像素为单位，与显示器的分辨率的像素是一致的。800×600的显示分辨率下，如果表格设置成1000个像素的宽度，那么，得出的效果将导致IE的横向滚动条出现，只有通过滑动它才能看到表格最右边的内容，所以建议在设置表格的宽度时充分考虑显示分辨率问题。width的取值还可以使用百分比，如widht="100%"，这种赋值法有个好处：表格的宽度将根据可显示的宽度来自我调整宽度。

11.height：表格的高度，取值方法同width。提示：如果不是特别需要，建议不用设置表格的高度，系统会根据表格的内容自动设置高度。所谓特别的需要，是指一些特殊的情形下，需要表格的高度精确，比如，当我们通过表格的背景来发一张图片时，如果表格的高度不精确定义，图片就不可能完整或完美地显示。

12.bgcolor：表格的背景色。取值方法举例：bgcolor=#ff0000或bgcolor=red。单元格<td>也可有此属性，如果设置了表格的背景色，又设置表格单元格的背景色，得出的效果将是值得试试的，这种情况主要用于多单元格的表格。

13.background：表格的背景图。其值为一个有效的图片地址。<td>也有此属性。同时设置背景色和背景图不冲突，也建议这么做，这样，当图片不能显示时，表格的外观依然是好看的。

14. bordercolor：表格的边框颜色，当border值不为0时设置此值有效。取值同bgcolor。

15.bordercolorlight：亮边框颜色，当border值不为0时设置此值有效。亮边框指表格的左边和上边的边框。

16.bordercolordark：暗边框颜色，当border值不为0时设置有效。暗边框指表格的右边和下边的边框。

17. align：表格的对齐方式，值有left（左对齐，默认）、center（居中）以及right（右对齐）。align定义的是表格自身的位置，这是一个很有用的属性，强烈建议使用它来规定表格的对齐方式，尽量不要使用<p align=?>表格</p>、<div align=?>表格</div>和<center>表格</center>之类的标签来规定表格的位置，因为这么做将导致论坛添加许多废码！此外，当表格的宽度设置为100%，或者，表格的宽度设置成了占满它所在的容器的宽度，没有必要定义align属性。

18. <font></font>它可以对输出文本的字体大小、其语法通常由 size=字体大小号码) color =颜色常量名，face=选用的字体。

19. <img>标志对的src属性赋值在图片中引用。

浅水游 · 发表于 2006-12-6 14:22:34

楼主辛苦了

天下 · 发表于 2006-12-6 14:33:19

画一个表格。

表格是一个特效帖子的最基本元素，因此，通过HTML来画一个表格也就成了最基本的技能。

首先，在“使用HTML代码”框里打勾。

然后，在编辑栏里编辑

<table border=1 cellpadding=8 cellspacing=16 bgcolor=#cc9968 bordercolor=#ff0000 width=400 align=center>
<tbody>
<tr>
<td>表格里的内容写在这里
</td>
</tr>
</tbody>
</table>

提交。

天下 · 发表于 2006-12-6 14:35:27

我们可以看到，效果是这样的：
<TABLE borderColor=#ff0000 cellSpacing=16 cellPadding=8 width=400 align=center bgColor=#cc9968 border=1>
<TBODY>
<TR>
<TD>表格里的内容写在这里 </TD></TR></TBODY></TABLE>

天下 · 发表于 2006-12-6 14:53:09

表格画好后，我们学习一下怎样填充表格里的内容。

1.填充字体.字号以及字体颜色.

<P align=cente><FONT face=宋体 color=#9709f7 size=5>哈飞车友会</FONT></P>

#9709f7 是字体颜色. 5代表字号 face=宋体(都可以根据自己的喜好改变)

2.填充图片.

<P align=center><IMG src= ＂链接网址＂></P>

如果是两张并列的图片.代码如下.

<P align=center><IMG src= ＂链接网址＂><IMG src= ＂链接网址＂></P>

如果是三张,以此类推.把</P>放在结尾处就行了.

3.填充背景音乐

<embed src="音乐链接址" hidden=true type=audio/x-ms-wma loop="true" autostart="true" ></embed>

（特别提示：hidden表示隐藏播放器，loop表示循环，autostart表示自动开始，而它们的值"true"表示"真"，如果改为<loop="false" autostart="false"则表示"假"，意思是不循环，手动播放。如果不想把播放器隐藏，那么我们只要界定出这个播放器的宽width=个人爱好自定值高height=45，变成<embed src="音乐链接址" width=个人爱好自定值 height=45 type=audio/x-ms-wma loop="true" autostart="true" ></embed>，那么就能看到播放器了）。
　　
4.填充FLASH.

<P align=center><EMBED align=center src=FLASH链接网址 width=400 height=300 type=application/octet-stream wmode="transparent" quality="high" ></P>

width=400 界定这个FLASH的宽，height=300是界定高。

		自动登录	找回密码
密码			立即注册