╰≡〇简明制图教程→◆◆◆

半溪梅影

最基础的也是最重要的，下面我们就先从最基本的贴图开始：

第一讲：贴图

1。首先打开一张图片，如：

记住我们现在说的都是网上的图片，而不是你存在电脑中的图片哦（电脑中保存的图片要贴出来需要上传，这个我们后面会讲到的）。

2。然后在图片上单击鼠标右键，如图所示：

3。点击属性，在弹出的对话框中查看图片地址：

4。然后复制、粘贴，得出图片地址：

http://www.yue.cc/bbs/UploadFile/2005-7/200572022441928813.jpg

那么如何用HTML标签把它转化为图片呢？

5。用以下代码：

<*img src=http://www.yue.cc/bbs/UploadFile/2005-7/200572022441928813.jpg>即可得到如下效果(使用时去掉＊号)：

当然，我们还可以有更简便的办法——那就是不用自己输入贴图标签，只要点击发言栏上方的图标，把要贴的图片网址输入，点击“确定”就好了。

是不是很简单？现在你会贴图了吗？ ：））

其实，贴图有两种方法的~~一种是刚才说过的帖网址，另一种就是上传。有朋友需要将自己电脑里的图片用到HTML制作的美图中去，怎么办呢？可以按下列步骤操作。

1。首先我们点击 或是打开这样的画面：

2。然后，点击“浏览”

3。在你的电脑里找到要上传的图片，选中，然后点击“上传”（要上传多张图片还可以通过点击“批量上传”来每次上传五张以节省时间）。稍等一分钟左右，就会在页面上出现“上传成功”字样。

4。点击“发表”，OK，大功告成。


小贴士：
1。由于各论坛对会员每人每天可以上传图片的数量一般都有限制，如果在限制之外还想多发图片，可以通过在一些大门户网站上传后再贴网址的办法来解决。
2.由于系统对上传图片大小有限制，因此，对于大于规定尺寸的图片应事先用有关修图软件重新定义大小，然后再上传，才能保证成功。

顺便推荐几个免费上传网址：

推荐两个免费上传的地址
http://www.yue.cc/bbs/dispbbs.asp?boardID=36&ID=86425&page=1

[转帖]推荐一些免费相册空间集

http://www.yue.cc/bbs/dispbbs.asp?boardID=36&ID=73375&page=1

[此贴子已经被作者于2005-7-20 23:13:12编辑过]

半溪梅影

第二讲：贴背景

看到别人的贴的华丽的背景，你是不是很羡慕呢，其实也没什么的，只要你了解一些代码的应用，相信你也会贴出漂亮的帖子。 ：））

第一步：

那么我们先了解一下代码的含义：

一般一个最简单的帖子是由这些基本代码组成的：（一张图片、一个背景。）

代码如下：<*center>(这个是居中)

<*table background= cellpadding= cellspacing= bgcolor= border=>（边框尺寸、背景图片）

<*tr>

<*td>

<*P><*FONT color=#ff0000>中间加图片或文字<*/FONT><*/P><*/td><*/table><*/center>

特别强调： <＊table><＊tr><＊td><＊table><＊td>图片、文字<＊/td><＊/table><＊/td><＊/table>
首尾一定要呼应，就是说前面有多少个<＊table><＊tr><＊td>，后面也一样有多少<＊/td><＊/table>。不然你的帖子会很难看哦。

其中：
center表示表格居中，同类属性还有right，left；

background＝背景图片地址，图片格式为gif，jpg，jpeg，png等格式；

cellspacing=数值或百分比，数值表示的是以象素为单位，百分比是相对于屏幕而言，表示格线与内容之间的距离；

cellspacing=数值或百分比，同上，表示格线与格线之间的距离；

bgcolor=RGB颜色代码，表示背景颜色，如果有背景图片可有可无；

border=数值，表示背景厚度。

第二步：

我们再打开一个背景图片，背景图片的选择最好用纯色、简捷的图片（ 《素材超市》<还都附有源代码呢> 里有很多配套的背景图片，不妨去看看<点击帖名即可>）。如：

下面，我们就来做一个一层背景，一张图片的图图（对初学者而言，最简单的办法就是把代码框里的代码copy下来，然后在背景网址和图片网址处换上自己喜欢的背景和图片。）：

<*TABLE cellSpacing=5 cellPadding=0 width="40%" background=http://serenity2designs.org/mystrip2 border=0><*TBODY><*TR><*TD width="100%"><*P align=center><*img SRC="http://serenity2designs.org/myspic.jpg" width=450 border=0><*/P><*/TD><*/TR><*/TBODY><*/TABLE><*br>

效果：

第三步：

再打开一个背景图片：

三层背景，一张图片：

<*table border="0" width="40%" background="http://serenity2designs.org/mystrip2" cellspacing="5" cellpadding="0">

<*tr><*td width="100%">

<*table border="0" width="100%" background="http://serenity2designs.org/mysstrip" cellspacing="5" cellpadding="0">

<*tr><*td width="100%">

<*table border="0" width="100%" background="http://serenity2designs.org/mystrip2" cellspacing="5" cellpadding="0">

<*tr><*td width="100%">

<*p align="center"><*img SRC="http://serenity2designs.org/myspic.jpg" width="400" height="330">

效果：

第四步：

下面我们把它加入到多层背景中 去（ 《模板》 里有很多多层背景的套图可以参考哦，点击看看8）。 这个是边框代码：

<*TABLE cellSpacing=40 cellPadding=20 width="100%" bgColor=#ffffff background=http://serenity2designs.org/mysbgtile.gif link="#9999ff" aLink="#ffffff" vLink="#0000cc" text="#ccccff">

<*TBODY><*TR><*TD align=middle width="100%">

<*TABLE cellSpacing=0 cellPadding=2 width="95%" background=http://serenity2designs.org/mysstrip.jpg border=0>

<*TBODY><*TR><*TD align=middle width="100%">

<*TABLE cellPadding=20 width="100%" background="" border=0>

<*TBODY><*TR><*TD align=middle width="100%">

<*TABLE cellSpacing=0 cellPadding=2 width="100%" background=http://serenity2designs.org/mysstrip.jpg border=0>

<*TBODY><*TR><*TD align=middle width="100%">

<*TABLE cellSpacing=0 cellPadding=10 width="100%" background=http://serenity2designs.org/mystrip2.jpg border=0>

<*TBODY><*TR><*TD align=middle width="100%">

<*TABLE cellSpacing=0 borderColorDark=#48556e cellPadding=0 width="100%" borderColorLight=#667593 background=http://serenity2designs.org/mystile.jpg border=1>

<*TBODY><*TR><*TD align=middle width="100%">

<*img SRC="http://serenity2designs.org/mysgb.gif" width=320 border=0>

<*img SRC="http://serenity2designs.org/mystitle.gif" width=327 border=0>

<*IMG height=81 src="http://serenity2designs.org/mystitle.gif" width=327 border=0>

三层背景的图片拷入这里

<*/TD><*/TR><*/TBODY><*/TABLE>

<*/TD><*/TR><*/TBODY><*/TABLE>

<*/TD><*/TR><*/TBODY><*/TABLE>

<*/TD><*/TR><*/TBODY><*/TABLE>

<*/TD><*/TR><*/TBODY><*/TABLE>

<*/TD><*/TR><*/TBODY><*/TABLE>

<*/TD><*/TR><*/TBODY><*/TABLE>

<*/TD><*/TR><*/TBODY><*/TABLE>

效果：

三层背景的图片拷入这里

把刚才第三步那个三层背景的图片代码考入 “三层背景的图片拷入这里”处，于是，一幅html图就做成了。效果：

OK！：））期待大家的进步~！ ：））

[此贴子已经被作者于2005-7-23 3:23:56编辑过]

半溪梅影

第三讲：美化帖子的特效字

在制图过程中，如果妥善运用特效字，可以使自己精心制作的帖子锦上添花。有关特效字的效果和源代码，可以参照《学做特效字》 （点击即可参阅）这个帖子来做～～

半溪梅影

第四讲：配乐

陆续添加中

半溪梅影

第五讲：一些图片特效

如：雾化图片

陆续添加中

梳柳

谢谢老師的教程啊...收下了

咪咪

老师你讲的真细，楼主也辛苦也！

有老师这样细心的教学，我想我一定是可以学会的！

再次感谢楼主的佳帖，同时也在期待后续！！！

[em23][em23][em23]

笑逐颜开

半溪梅影

笑笑大姐做的很好啊，祝贺一下！

梳柳、咪咪两位不要客气。（汗……）好久没往上贴教程了，偶最近抓紧吧，陆续贴上来。

山脉

C:\Documents and Sotting\Li Lu\My Documen