教个作业吧然后我想说我只是个爱偷懒的学生，不适合当老师。

晓清发表于 2012-8-18 12:12:08

本帖最后由鉨模仿不了姐D笑于 2012-8-18 12:11 编辑

做贴需要具备的以下几点：耐心，细心，要多看，多练习，不懂就问，这样学起来就会快很多。
不要一看见这么代码文字就乱了手脚，要认真的看完，
不要被那些一串串代码所吓倒，其实认识了那些基本的代码后，一点都不觉得难了。

真的是活到老学到老呀，感觉要学习的太多太多，永远都学不完一样。
其实吧，我知道的并不多，刚刚开始只是会套用一样代码而已，
时间久了也就自然的会学着改代码，添加代码了。

好了，说做贴过程吧

一个完整的帖子是由边框，图片，文字，歌曲，fiash，播放器组成的。
也可以只有一个边框，一些文字，也可以是图片加音乐，等等.....
这个需要你们自己去创新，去发挥。

如何运用HTML代码做出漂亮的边框。
http://www.ii23.cn/thread-209384-1-1.html

可以参照鸽子大师的简单实用的HTML代码介绍来帖来寻求解答：
http://www.ii23.cn/thread-217297-1-1.html

简单的HTML代码做出来的表格效果。
http://www.ii23.cn/thread-217299-1-1.html

html 码是很复杂的东西，初学者往往一看那么多看不懂的数字就头疼，其实知道了有些基本的代码就简单了，

那一串串代码知道那些是可以改动的，那里是不可以更改的，那么学起来就容易多了，下面就让我们来做试着做一个吧

晓清发表于 2012-8-18 12:12:09

本帖最后由鉨模仿不了姐D笑于 2012-8-18 12:01 编辑 <br /><br />注意看代码中颜色的地方，你可以尝试更改看看。<BR>红色标记代表的是边框颜色，蓝色标记代表的是高宽。一般只需要改这2个就可以了。<BR><BR><STRONG><FONT color=darkred>帖子第一步就是懒人边框：<BR></FONT></STRONG>
<BLOCKQUOTE><FONT color=red><BR>
<DIV class=blockcode>
<BLOCKQUOTE><FONT color=black><STRONG><FONT color=darkred>懒人边框代码：<BR></FONT></STRONG><BR><BR><BR><DIV style="POSITION: relative; WIDTH: <FONT color=blue>1004px</FONT>; HEIGHT: <FONT color=blue>691px</FONT>; TOP: <FONT color=blue>40px</FONT>; LEFT: 0px" id=table1><BR><TABLE style="WIDTH: <FONT color=blue>729px</FONT>; HEIGHT:<FONT color=blue> 403px</FONT>" id=table1 border=15 cellSpacing=3 borderColor=<FONT color=red>#</FONT><FONT color=red>2f4f4f</FONT> cellPadding=8 width=<FONT color=blue>729</FONT> bgColor=<FONT color=red>#</FONT><FONT color=red>ffbb77</FONT> height=<FONT color=blue>403</FONT>><BR><TBODY><BR><TR><BR><TD><FONT color=<FONT color=red>#</FONT><FONT color=red>2f4f4f</FONT> size=4 face=黑体><BR><TABLE style="WIDTH: <FONT color=blue>500px</FONT>; HEIGHT: <FONT color=blue>140px</FONT>" border=0 background=<FONT color=purple>http://99927.com/client/zcsl/200644152842607.GIF</FONT> align=center><BR><TBODY></TBODY></TABLE></FONT></TD></TR></TBODY></TABLE></DIV><BR></FONT><BR><BR></BLOCKQUOTE></DIV><BR><BR></FONT>
<DIV class=block><STRONG>注意我打了标记的地方可以尝试着修改试试效果。<BR></FONT></STRONG><STRONG><FONT color=darkred>这个是简单边框的效果图<BR></FONT></STRONG>
<DIV style="POSITION: relative; WIDTH: 620px; HEIGHT: 348px; TOP: 40px; LEFT: 0px" id=table1>
<TABLE style="WIDTH: 588px; HEIGHT: 340px" id=table1 border=15 cellSpacing=3 borderColor=#2f4f4f cellPadding=8 width=588 bgColor=#ffbb77 height=340>
<TBODY>
<TR>
<TD>
<P align=center><FONT color=#2f4f4f size=4 face=黑体><STRONG><FONT color=magenta>空白</FONT> </STRONG></P>
<TABLE style="WIDTH: 500px; HEIGHT: 140px" border=0 background=http://99927.com/client/zcsl/200644152842607.GIF align=center>
<TBODY></TBODY></TABLE></FONT></TD></TR></TBODY></TABLE></DIV><BR><BR><BR><BR><FONT color=darkred><STRONG>第二步添加一个彩虹字体代码：</STRONG></FONT><FONT color=blue>当然你也可以换成别的代码，方法是一样的。<BR></FONT>便于更好的在边框中添加代码，你可以在边框中打2个字，看见效果图中的空白2字了吗？勾上纯文本，在那2个字那里添加别的代码。<BR>  </DIV></BLOCKQUOTE>
<DIV class=blockcode>
<BLOCKQUOTE><STRONG><FONT color=red>彩虹字体代码：<BR></FONT></STRONG><FONT color=<FONT color=red>#</FONT><FONT color=red>2f4f4f </FONT>size=<FONT color=magenta>4</FONT> face=黑体><BR><TABLE style="WIDTH: <FONT color=blue>500px</FONT>; HEIGHT: <FONT color=blue>140px</FONT>" border=<FONT color=magenta>0 </FONT>background=<FONT color=seagreen>http://99927.com/client/zcsl/200644152842607.GIF</FONT> align=center><BR><TBODY><BR><TR><BR><TD style="FILTER: mask(color=<FONT color=red>#</FONT><FONT color=red>2f4f4f</FONT>)" align=middle><BR><P><FONT style="FONT-SIZE: <FONT color=blue>38pt</FONT>" color=<FONT color=red>#</FONT><FONT color=red>336699</FONT> size=<FONT color=magenta>3</FONT> face=华文行楷><B></B></FONT> </P><BR><P><FONT style="FONT-SIZE: 3<FONT color=blue>8pt</FONT>" color=<FONT color=red>#</FONT><FONT color=red>336699</FONT> size=<FONT color=magenta>7 </FONT>face=华文行楷><B><FONT color=darkorchid>爱生活，爱ii23</FONT>。</B></FONT></P><BR><P><STRONG><FONT color=<FONT color=red>#</FONT><FONT color=red>336699</FONT> size=<FONT color=magenta>3</FONT> face=华文行楷></FONT></STRONG> </P></TD></TR></TBODY></TABLE></FONT><BR><BR><BR><BR><BR></BLOCKQUOTE></DIV><FONT color=blue><BR><STRONG>这是添加了上面那个彩虹字体代码后的效果图：<BR></STRONG></FONT><FONT color=black>然后再继续下面的依然打2个字，添加别的代码。
<DIV style="POSITION: relative; WIDTH: 743px; HEIGHT: 402px; TOP: 40px; LEFT: 0px" id=table1>
<TABLE style="WIDTH: 729px; HEIGHT: 403px" id=table1 border=15 cellSpacing=3 borderColor=#2f4f4f cellPadding=8 width=729 bgColor=#ffbb77 height=403>
<TBODY>
<TR>
<TD><FONT color=#2f4f4f size=4 face=黑体><FONT color=#2f4f4f size=4 face=黑体>
<TABLE style="WIDTH: 500px; HEIGHT: 140px" border=0 background=http://99927.com/client/zcsl/200644152842607.GIF align=center>
<TBODY>
<TR>
<TD style="FILTER: mask(color=#2f4f4f)" align=middle>
<P><FONT style="FONT-SIZE: 38pt" color=#336699 size=3 face=华文行楷><B></B></FONT> </P>
<P><FONT style="FONT-SIZE: 38pt" color=#336699 size=7 face=华文行楷><B>爱生活，爱ii23。</B></FONT></P>
<P><STRONG><FONT color=#336699 size=3 face=华文行楷></FONT></STRONG> </P></TD></TR></TBODY></TABLE></FONT><BR><BR><BR><BR>
<P align=center><FONT color=cyan><STRONG>空白</STRONG></FONT></P>
<TABLE style="WIDTH: 500px; HEIGHT: 140px" border=0 background=http://99927.com/client/zcsl/200644152842607.GIF align=center>
<TBODY></TBODY></TABLE></FONT></TD></TR></TBODY></TABLE></DIV></FONT>

晓清发表于 2012-8-18 12:12:10

本帖最后由鉨模仿不了姐D笑于 2012-8-18 12:02 编辑 <br /><br /><FONT color=darkred><STRONG>第三步添加滚动图片代码：</STRONG><FONT color=#0000ff>当然你也可以换成别的代码，方法是一样的。</FONT><BR><BR><FONT color=black>这是5张图片的代码，你可以增加也可以减少,<FONT color=green><INPUT src="图片地址" width=300 type=image>.<BR></FONT>
<DIV class=blockcode>
<BLOCKQUOTE><STRONG><FONT color=darkred>滚动图片代码;<BR></FONT></STRONG><MARQUEE><INPUT src="<FONT color=red>图片地址</FONT>" width=<FONT color=blue>300</FONT> type=image> <INPUT src="<FONT color=red>图片地址</FONT>" width=<FONT color=blue>300</FONT> type=image> <INPUT src="<FONT color=red>图片地址</FONT>" width=<FONT color=blue>300</FONT> type=image> <INPUT src="<FONT color=red>图片地址</FONT>" width=<FONT color=blue>300</FONT> type=image> <INPUT src="<FONT color=red>图片地址</FONT>" width=<FONT color=blue>300</FONT> type=image></MARQUEE><BR><BR></BLOCKQUOTE></DIV></FONT></FONT><STRONG><FONT color=darkred><BR><BR><BR>完成第三步后的效果图：<BR></FONT></STRONG>下面的继续打2个字方便添加下一步的代码。<BR><BR>
<DIV style="POSITION: relative; WIDTH: 743px; HEIGHT: 729px; TOP: 40px; LEFT: 0px" id=table1>
<TABLE style="WIDTH: 729px; HEIGHT: 403px" id=table1 border=15 cellSpacing=3 borderColor=#2f4f4f cellPadding=8 width=729 bgColor=#ffbb77 height=403>
<TBODY>
<TR>
<TD><FONT color=#2f4f4f size=4 face=黑体>
<TABLE style="WIDTH: 500px; HEIGHT: 140px" border=0 background=http://99927.com/client/zcsl/200644152842607.GIF align=center>
<TBODY></TBODY></TABLE><FONT color=#2f4f4f size=4 face=黑体>
<TABLE style="WIDTH: 500px; HEIGHT: 140px" border=0 background=http://99927.com/client/zcsl/200644152842607.GIF align=center>
<TBODY>
<TR>
<TD style="FILTER: mask(color=#2f4f4f)" align=middle>
<P><FONT style="FONT-SIZE: 38pt" color=#336699 size=3 face=华文行楷><B></B></FONT></P>
<P><FONT style="FONT-SIZE: 38pt" color=#336699 size=7 face=华文行楷><B>爱生活，爱ii23。</B></FONT></P>
<P><STRONG><FONT color=#336699 size=3 face=华文行楷></FONT></STRONG></P></TD></TR></TBODY></TABLE></FONT><BR><BR><BR>
<MARQUEE><INPUT src="http://img170.poco.cn/mypoco/myphoto/20120815/21/66080233201208152138146476374334948_004.jpg" width=300 type=image> <INPUT src="http://img170.poco.cn/mypoco/myphoto/20120815/21/66080233201208152138146476374334948_001.jpg" width=300 type=image> <INPUT src="http://img170.poco.cn/mypoco/myphoto/20120815/21/66080233201208152138146476374334948_000.jpg" width=300 type=image> <INPUT src="http://img170.poco.cn/mypoco/myphoto/20120815/21/66080233201208152138146476374334948_002.jpg" width=300 type=image> <INPUT src="http://img170.poco.cn/mypoco/myphoto/20120815/21/66080233201208152138146476374334948_003.jpg" width=300 type=image></MARQUEE><BR><BR>空白<BR></FONT></TD></TR></TBODY></TABLE></DIV><BR><BR><BR><FONT color=darkred><STRONG>第四步添加移动文字或者图片代码：</STRONG><FONT color=#0000ff>当然你也可以换成别的代码，方法是一样的。</FONT><BR><BR></FONT>
<DIV class=blockcode>
<BLOCKQUOTE><STRONG><FONT color=darkred>移动文字或者图片代码： <BR></FONT></STRONG><BR><MARQUEE> <FONT color=red>移动内容：文字或图片</FONT> </MARQUEE> <BR></BLOCKQUOTE></DIV><STRONG><FONT color=blue>完成第四步的效果图如下：<BR></FONT></STRONG><BR>
<DIV style="POSITION: relative; WIDTH: 773px; HEIGHT: 1120px; TOP: 40px; LEFT: 0px" id=table1>
<TABLE style="WIDTH: 729px; HEIGHT: 897px" id=table1 border=15 cellSpacing=3 borderColor=#2f4f4f cellPadding=8 width=729 bgColor=#ffbb77 height=897>
<TBODY>
<TR>
<TD><FONT color=#2f4f4f size=4 face=黑体>
<TABLE style="WIDTH: 500px; HEIGHT: 140px" border=0 background=http://99927.com/client/zcsl/200644152842607.GIF align=center>
<TBODY>
<TR>
<TD style="FILTER: mask(color=#2f4f4f)" align=middle>
<P><FONT style="FONT-SIZE: 38pt" color=#336699 size=3 face=华文行楷><B></B></FONT> </P>
<P><FONT style="FONT-SIZE: 38pt" color=#336699 size=7 face=华文行楷><B>爱生活，爱上学院。</B></FONT></P>
<P><STRONG><FONT color=#336699 size=3 face=华文行楷></FONT></STRONG> </P></TD></TR></TBODY></TABLE>
<P></P><BR><BR>
<MARQUEE><INPUT src="http://img170.poco.cn/mypoco/myphoto/20120815/21/66080233201208152138146476374334948_004.jpg" width=300 type=image> <INPUT src="http://img170.poco.cn/mypoco/myphoto/20120815/21/66080233201208152138146476374334948_001.jpg" width=300 type=image> <INPUT src="http://img170.poco.cn/mypoco/myphoto/20120815/21/66080233201208152138146476374334948_000.jpg" width=300 type=image> <INPUT src="http://img170.poco.cn/mypoco/myphoto/20120815/21/66080233201208152138146476374334948_002.jpg" width=300 type=image> <INPUT src="http://img170.poco.cn/mypoco/myphoto/20120815/21/66080233201208152138146476374334948_003.jpg" width=300 type=image></MARQUEE></FONT>　
<MARQUEE style="WIDTH: 684px; HEIGHT: 60px"><STRONG><FONT color=magenta size=4>ii23娱乐休闲社区；多个精品版块欢迎新老朋友的光临！一起爱上进步、爱上学习、爱上交流。</FONT></STRONG></MARQUEE></TD></TR></TBODY></TABLE><BR><BR><BR><BR><BR><FONT color=darkred><STRONG><FONT size=4>一般在代码框中更换＂图片地址＂，运行效果成功，就是一个作品了．</FONT></STRONG><BR><STRONG>一般1/2个代码就可以是一个完整作品，这里我就不再添加音乐代码了，免得代码添加的多了犯迷糊，<BR>使用酷狗还有虾米也是一样的，重要的是大家已经用习惯了。</STRONG></FONT><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR></DIV><BR>

农村，小姑娘。 发表于 2012-8-18 13:22:08

滚动图片都有了很好的教程

再见，夏日阳光 发表于 2012-8-18 16:30:14

空白辛苦了。很好的教程。

他城°初见。 发表于 2012-8-18 18:39:20

333333啊，你辛苦了。
我都不好意思说啥了。。

jackal911 发表于 2012-8-18 22:31:13

牛人就是牛人跟一般人是不一样的

寂如流年 发表于 2012-8-19 20:37:09

好厉害的滚动代码，啥都有了，慢慢学习

Raunchy 发表于 2012-8-20 22:15:04

比较懒，忘了再来学习下

彦西子 发表于 2012-8-30 10:19:43

谢谢妞每一次都认真给予的帮助

彦西子 发表于 2012-8-30 10:20:18

{:73_607:}喜欢收藏啦

笃定会幸福 发表于 2012-9-3 09:33:09

新手进来学习

页: [1]

三毛钱's Archiver

教个作业吧 然后我想说我只是个爱偷懒的学生，不适合当老师。

教个作业吧然后我想说我只是个爱偷懒的学生，不适合当老师。