网页代码学习——从生手到精通—

网页代码学习——从生手到精通
边框，图片，表格，内容的步步演示

小院的目的就是想让所有的夕阳人充实和快乐——高手勿笑

如果您对代码学习很生疏的话，那就让我们先来做一下代码学习的准备工作

第一步：先用代码做一个简单的边框，内置底色为：bgColor=#00ff00 绿色

网页代码学习——从生手到精通

1：边框加上内置底色（本边框高为：150px，实际高度应比图片高）

第二步：再于内置底色上附上一张图片，用它来作为作品的背景

网页代码学习——从生手到精通

2：边框加上内置图片

第三步：在背景图片上设置你想要的纵向和横向表格

网页代码学习——从生手到精通

第一横向表格1	第一横向表格2	第一横向表格3
第二横向表格1	第二横向表格2	第二横向表格3
第三横向表格1	第三横向表格2	第三横向表格3

代码如下：
<HTML>
<HEAD>
<TITLE>网页代码学习——从生手到精通</TITLE>
</HEAD>

<TR>
<TD width="20%">
<P align=center>第一横向表格1</P></TD>

<TD width="60%">
<P align=center>第一横向表格2</P></TD>

<TD width="20%">
<P align=center>第一横向表格3</P></TD></TR>

<TR>
<TD width="20%">
<P align=center>第二横向表格1</P></TD>

<TD width="60%">
<P align=center>第二横向表格2</P></TD>

<TD width="20%">
<P align=center>第二横向表格3</P></TD></TR>

<TR>
<TD width="20%">
<P align=center>第三横向表格1</P></TD>

<TD width="60%">
<P align=center>第三横向表格2</P></TD>

<TD width="20%">
<P align=center>第三横向表格3</P></TD></TR>

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

</BODY>
</HTML>
代码结束

第四步：在每个表格中添加你想添加的各种动画，图片素材或者文字

网页代码学习——从生手到精通

意

简单的表格

境

代码如下：
<HTML>
<HEAD>
<TITLE>网页代码学习——从生手到精通</TITLE>
</HEAD>

<TD width="60%">
<P align=center><BR><BR><BR><BR><FONT style="FONT-SIZE: 20pt; FILTER: shadow(color=#AF0530); WIDTH: 100%; COLOR: #f90b46; FONT-FAMILY: 隶书; HEIGHT: 70px; LINE-: 100%">
<P align=center><B>简单的表格</B></P></FONT></P></TD>

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

</BODY>
</HTML>
代码结束

第五步：在最后代码的前面加上背景音乐，您的第一个小网页制作成功，小院再一次恭喜您！

最后：那怎么样才能发表在我们的网站上呢？要加上左移120像素的代码呀！

左移120像素的代码：
<DIV style="LEFT: -120px; WIDTH: 1000px; POSITION: relative; TOP: 0px">
《这里放您的全部网页代码》最后加截止代码</DIV>就完全成功了
最后把全部代码在源代码形式粘贴到发表框内：
<DIV style="LEFT: -120px; WIDTH: 1000px; POSITION: relative; TOP: 0px">

</BODY></DIV>

代码结束

网页代码学习——从生手到精通

不争春夏日——但赏夕阳红
打造健康和谐的中老年网络学习乐园