武当休闲山庄

离线飞雪思函

UID: 213627

精华: 54
职务: 山庄上宾
级别: 武当泰斗

发帖: 4198

金币: 15325

道行: 261

原创: 133

奖券: 885

斑龄: 18

道券: 0

获奖: 0

座驾

设备

摄影级

在线时间: 3097(小时)
注册时间: 2007-06-02
最后登录: 2012-10-04

只看楼主倒序阅读使用道具楼主发表于: 2008-05-18

— 本帖被色影执行加亮操作(2010-07-15) —

一点体会：
第一:写"回"字.用HTML制帖,打一个比方,就像我们写一个"回"字.是一种单一的边框结构,起初接触代码好像很难,但是等你熟悉每个代码标签的含义,也就不难了!呵呵,但是这个熟悉的过程是要很大的勇气的.想当初,我可是硬着头皮试试才上"贼船"的.没想到上船容易下船难,从此就爱上了这破东东!!!言归正传,我们写"回"字,按照笔划顺序来讲,该是先里边后外边吧!无论这个"口"字里有多个个"口"字,最里边的"口"先结束,最外边的最后啦!!!用HTML制帖,就是这个道理,当然,这是最基础的一种制作方法,等大家熟悉掌握运用这些代码后,更加复杂的布局,比如像制作一张简易的工作人员花名册,这里就涉及到行<TR>.列<TD>,好像是更难一点的了,等大家熟悉运用这些代码后,自然不难了!!!
　　第二:有始有终.用HTML制作,最重要的一点就是做到有始有终.也就是有开始必须有结束.用<P>这个标签说明,它是表示段落的标签代码,当一段编辑后,必需用</P>表示结束.
　　第三:拿来主义.掌握并熟悉地运用HTML后.接触的帖子也多了,你会发现,每一个人有每一个人的制作方法及特点.那么,我们在欣赏别人精典制作的同时,不仿拿回家看看.该收藏的收藏,该掌握的掌握.比如素材好我们就收藏,自己做帖时可以运用,比如制作特点,方法,我们拿为己用.呵呵,网络可是个大宝库,多吸收营养,这样有利于进步哟!

想学的朋友，加油，希望大家在这里玩得有收获，我们一起交流一起学习，让我们的贴子漂亮起来~~

[ 此贴被飞雪思函在2008-06-23 18:00重新编辑 ]

共2条评分

By 明天.	原创 +1	\| 理由: 原创内容	2008-05-18
By 腾龙在天	金币 +10	\| 理由: 优秀文章	2008-05-18

山庄提示：道行不够，道券不够？---☆点此充值☆

分享到 淘江湖新浪 QQ微博 QQ空间开心人人豆瓣网易微博百度鲜果白社会飞信

离线飞雪思函

UID: 213627

精华: 54
职务: 山庄上宾
级别: 武当泰斗

发帖: 4198

金币: 15325

道行: 261

原创: 133

奖券: 885

斑龄: 18

道券: 0

获奖: 0

座驾

设备

摄影级

在线时间: 3097(小时)
注册时间: 2007-06-02
最后登录: 2012-10-04

只看该作者沙发发表于: 2008-05-18

申请VIP---在山庄畅通无阻还送FTP单独下载账号!

准备工作,认识代码

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属性赋值在图片中应用

红色部分可要记住．在制帖，他们的位置可不是能换动的．

共1条评分

By 凉风友情

金币 +20

| 理由: 鼓励一下

2008-05-18

如何不发帖就快速得到金币和道行

离线飞雪思函

UID: 213627

精华: 54
职务: 山庄上宾
级别: 武当泰斗

发帖: 4198

金币: 15325

道行: 261

原创: 133

奖券: 885

斑龄: 18

道券: 0

获奖: 0

座驾

设备

摄影级

在线时间: 3097(小时)
注册时间: 2007-06-02
最后登录: 2012-10-04

只看该作者板凳发表于: 2008-05-18

下面给出一个表格式样，表格中有一些简单的说明。

本表格的属性设置：
边框大小：border=1
边框颜色：bordercolor=#ff0000
背景色：bgcolor=#cc9968
表格宽度：width=400
单元格间距：cellspcing=16
单元格衬距：cellpadding=8
表格的对齐方式（居中）：align=center
注：其他属性未设置。

如何不发帖就快速得到金币和道行

离线飞雪思函

UID: 213627

精华: 54
职务: 山庄上宾
级别: 武当泰斗

发帖: 4198

金币: 15325

道行: 261

原创: 133

奖券: 885

斑龄: 18

道券: 0

获奖: 0

座驾

设备

摄影级

在线时间: 3097(小时)
注册时间: 2007-06-02
最后登录: 2012-10-04

只看该作者地板发表于: 2008-05-18

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

如何不发帖就快速得到金币和道行

离线飞雪思函

UID: 213627

精华: 54
职务: 山庄上宾
级别: 武当泰斗

发帖: 4198

金币: 15325

道行: 261

原创: 133

奖券: 885

斑龄: 18

道券: 0

获奖: 0

座驾

设备

摄影级

在线时间: 3097(小时)
注册时间: 2007-06-02
最后登录: 2012-10-04

只看该作者 4楼发表于: 2008-05-18

建边框以及填充里面的文字内容

　　一、贴子重要部分是建立一个边框，下面我会提供几个成品边框，有一层的，二层的等等，看你想要哪个了。注意，红色部分是内容。应保持边框代码的完整性~~
　　二、边框里加入的内容，有文字，图片，音乐。文字有多种供你选择，选到你喜欢的文字之后，改变其颜色，大小到你想满意为止。图片花样最多，选中你想要的图片格式代码，只需更改其图片地址即可。音乐最简单，改成你想要的音乐地址.

　　下例是一个一层的边框.现在教大家怎样在这个边框里填充文字内容.

<table border=1 cellpadding=8 cellspacing=16 bgcolor=#cc9968 bordercolor=#ff0000 width=400 align=center>
<tbody>
<tr>
<td>文字内容</td>
</tr>
</tbody>
</table>

　　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>
(特别提示: LOOP="TRUE" AUTOSTART="TRUE" 这里的"TRUE"是自动播放的意思.如果改为<LOOP="FALSE" AUTOSTART="FALSE"则为手动播放.这里的"FALSE"是手动播放意思,同理,如果不想把些播放器材隐藏,那么我们只要界定出这个播放器的宽width=个人爱好自定值高height=50,那么就能看到播放器了>
　　
　　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是界定高.熟悉准备工作的朋友,应该已经熟悉这两个标签的意义了!

[ 此贴被飞雪思函在2008-06-10 11:23重新编辑 ]

如何不发帖就快速得到金币和道行

离线飞雪思函

UID: 213627

精华: 54
职务: 山庄上宾
级别: 武当泰斗

发帖: 4198

金币: 15325

道行: 261

原创: 133

奖券: 885

斑龄: 18

道券: 0

获奖: 0

座驾

设备

摄影级

在线时间: 3097(小时)
注册时间: 2007-06-02
最后登录: 2012-10-04

只看该作者 5楼发表于: 2008-05-18

实例填充图片

如何不发帖就快速得到金币和道行

离线飞雪思函

UID: 213627

精华: 54
职务: 山庄上宾
级别: 武当泰斗

发帖: 4198

金币: 15325

道行: 261

原创: 133

奖券: 885

斑龄: 18

道券: 0

获奖: 0

座驾

设备

摄影级

在线时间: 3097(小时)
注册时间: 2007-06-02
最后登录: 2012-10-04

只看该作者 6楼发表于: 2008-05-18

实例代码如下：
<TABLE borderColor=#ff0000 cellSpacing=16 cellPadding=8 width=400 align=center bgColor=#cc9968 border=1>
<TBODY>
<TR>
<TD>
<P align=center><IMG src="图片链接址"></P>
<P align=center>
<P align=center>
<P align=center><FONT size=5>实例填充图片</FONT></P>
</TD>
</TR>
</TBODY>
</TABLE>

如何不发帖就快速得到金币和道行

离线飞雪思函

UID: 213627

精华: 54
职务: 山庄上宾
级别: 武当泰斗

发帖: 4198

金币: 15325

道行: 261

原创: 133

奖券: 885

斑龄: 18

道券: 0

获奖: 0

座驾

设备

摄影级

在线时间: 3097(小时)
注册时间: 2007-06-02
最后登录: 2012-10-04

只看该作者 7楼发表于: 2008-05-18

下面不用颜色用背景,改用链接址作背景.示例一层边框:

[ 此贴被飞雪思函在2008-05-18 09:45重新编辑 ]

如何不发帖就快速得到金币和道行

离线飞雪思函

UID: 213627

精华: 54
职务: 山庄上宾
级别: 武当泰斗

发帖: 4198

金币: 15325

道行: 261

原创: 133

奖券: 885

斑龄: 18

道券: 0

获奖: 0

座驾

设备

摄影级

在线时间: 3097(小时)
注册时间: 2007-06-02
最后登录: 2012-10-04

只看该作者 8楼发表于: 2008-05-18

上例代码:
<TABLE cellSpacing=0 cellPadding=0 width=500 background=0 align=center border=0 >
<TBODY>
<TR>
<TD>
<BR><BR>
<P align=center><IMG src="雨荷地址"></P>
<BR><BR>
</TD>
</TR>
</TBODY>
</TABLE>

[ 此贴被飞雪思函在2008-05-18 09:46重新编辑 ]

如何不发帖就快速得到金币和道行

离线飞雪思函

UID: 213627

精华: 54
职务: 山庄上宾
级别: 武当泰斗

发帖: 4198

金币: 15325

道行: 261

原创: 133

奖券: 885

斑龄: 18

道券: 0

获奖: 0

座驾

设备

摄影级

在线时间: 3097(小时)
注册时间: 2007-06-02
最后登录: 2012-10-04

只看该作者 9楼发表于: 2008-05-18

三层边框:

[ 此贴被飞雪思函在2008-06-10 11:30重新编辑 ]

如何不发帖就快速得到金币和道行

离线飞雪思函

UID: 213627

精华: 54
职务: 山庄上宾
级别: 武当泰斗

发帖: 4198

金币: 15325

道行: 261

原创: 133

奖券: 885

斑龄: 18

道券: 0

获奖: 0

座驾

设备

摄影级

在线时间: 3097(小时)
注册时间: 2007-06-02
最后登录: 2012-10-04

只看该作者 10楼发表于: 2008-05-18

三层边框代码:
<TABLE cellSpacing=25 borderColorDark=#344228 cellPadding=0 width="100%" align=center borderColorLight=#7ea063 background=http://www.fjsnow.com/bbs/UploadFile/2006-9/20069291252157566.gif border=0>
<TBODY>
<TR>
<TD>
<TABLE cellSpacing=15 borderColorDark=#344228 cellPadding=0 width="100%" align=center borderColorLight=#7ea063 background=http://bbs.muwen.com/fileuploaddir/4B314681902.jpg border=1>
<TBODY>
<TR>
<TD>
<TABLE cellSpacing=0 cellPadding=0 width="100%" background=http://i17.photobucket.com/albums/b51/lyh_/MATERIAL/bg/01/2cc7fd4b.jpg border=0>
<TBODY>
<TR>
<TD>
<P align=center>
<P align=center>
<P align=center><IMG src="图片链接地址"></P>
<P align=center>
<P align=center>
</TD></TR></TBODY></TABLE>
</TD></TR></TBODY></TABLE>
</TD></TR></TBODY></TABLE>

[ 此贴被飞雪思函在2008-06-10 11:37重新编辑 ]

如何不发帖就快速得到金币和道行

离线飞雪思函

UID: 213627

精华: 54
职务: 山庄上宾
级别: 武当泰斗

发帖: 4198

金币: 15325

道行: 261

原创: 133

奖券: 885

斑龄: 18

道券: 0

获奖: 0

座驾

设备

摄影级

在线时间: 3097(小时)
注册时间: 2007-06-02
最后登录: 2012-10-04

只看该作者 11楼发表于: 2008-05-18

五层边框代码:

武当休闲山庄欢迎您

[ 此贴被飞雪思函在2008-06-10 14:23重新编辑 ]

如何不发帖就快速得到金币和道行

离线飞雪思函

UID: 213627

精华: 54
职务: 山庄上宾
级别: 武当泰斗

发帖: 4198

金币: 15325

道行: 261

原创: 133

奖券: 885

斑龄: 18

道券: 0

获奖: 0

座驾

设备

摄影级

在线时间: 3097(小时)
注册时间: 2007-06-02
最后登录: 2012-10-04

只看该作者 12楼发表于: 2008-05-18

五层边框代码:

<TABLE id=table1 style="LEFT: -170px; WIDTH: 900px; POSITION: relative; TOP: 10px" cellSpacing=50 borderColorDark=#800000 cellPadding=0 align=center borderColorLight=#800000 background=http://www.fjsnow.com/bbs/UploadFile/2006-9/20069291252157566.gif border=1>
<TBODY>
<TR>
<TD>

<TABLE borderColorDark=#800000 cellPadding=15 width="100%" align=center　cellSpacing=0 borderColorLight=#800000 bgcolor=#660000 background=http://bbs.muwen.com/fileuploaddir/4B314681902.jpg border=0>
<TBODY>
<TR>
<TD>
<TABLE borderColorDark=#800000 cellPadding=10 width="100%" align=center　cellSpacing=0 borderColorLight=#800000 bgcolor=#999999 background=http://www.fjsnow.com/bbs/UploadFile/2006-9/20069291252157566.gif border=0>
<TBODY>
<TR>
<TD>
<TABLE borderColorDark=#800000 cellPadding=6 width="100%" align=center　cellSpacing=0 borderColorLight=#800000 bgcolor=#999999 background=http://bbs.nxnews.net/forum/UploadFile/2004-8/2004813135644130.jpg border=0>
<TBODY>
<TR>
<TD>
<TABLE borderColorDark=#800000 cellPadding=0 width="100%" align=center　cellSpacing=0 borderColorLight=#800000 bgcolor=#999999 background="http://i17.photobucket.com/albums/b51/lyh_/MATERIAL/bg/01/2cc7fd4b.jpg" border=0>
<TBODY>
<TR>
<TD>
<P align=center>
<P align=center><BR><BR>
<P align=center><IMG src="图片地址链接"></P>
<P align=center>
<P align=center> <BR><BR>
<P align=center><FONT color=#f0ffff size=6><B>武当休闲山庄欢迎您</B></FONT></P>
<P align=center>
<P align=center><BR><BR>
</TD></TR></TBODY></TABLE>
</TD></TR></TBODY></TABLE>
</TD></TR></TBODY></TABLE>
</TD></TR></TBODY></TABLE>
</TD></TR></TBODY></TABLE>

[ 此贴被飞雪思函在2008-06-10 14:09重新编辑 ]