分享

代码学习群简易教程(12)

 春天没来 2014-05-09

链接”,是指在电子计算机程序的各模块之间传递参数和控制命令,并把它们组成一个可执行的整体的过程。链接也称超级链接,是指从一个网页指向一个目标的连接关系,所指向的目标可以是另一个网页,也可以是相同网页上的不同位置,还可以是图片、电子邮件地址、文件、甚至是应用程序。
“链接标签”是一个非常重要的标签,是制作网页必不可少的一个标签。可以毫不夸张地说,是超链接把整个互联网连接了起来。如果没有超链接,就没有互联网。在一个网页中,您只要点击一下页面中超链接的内容,就可以进入链接的另一个网页了。我们能在互联网上任意浏览、任意收藏自己喜欢的内容,都是链接标签在起作用。
链接标签的表达方式为:
<a href="要链接的网址" target=_blank>内容</a>
注释:
尖括号中的“a”是链接标签名称。
href属性:用于指定超链接目标的地址。href 属性的值(即等号后面的内容)可以是任何有效文档的相对或绝对URL(地址)。也就是说,“链接地址”可以是互联网中任何网站、任何文章、任何图片的地址。
target属性:链接标签中的“target ”属性规定在何处打开链接文档。等号后面的“_blank”属值:是链接文件的“打开方式”为:在浏览器的新窗口中打开。
在链接标签中,“target=_blank”,属性属值相当重要,不能缺少。如果缺少了这个属性属值,原来的网页就关闭了。换句话来讲,链接标签中如果不设置“target=_blank”属性与属值,点击链接内容以后,就会跳转到链接的网页;链接标签中如果设置了“target=_blank”属性与属值,点击链接内容以后,就会在另一个窗口打开链接的网页。
内容:链接标签中的“内容”,可以是文字或者图片等内容。
喜迎蛇年喜迎蛇年
链接的类型:
网页上的超链接一般分为三种:
第一种是绝对URL的超链接。URL(Uniform. Resource Locator)是统一资源定位符,简单地讲就是网络上的一个站点、网页的完整路径。
第二种是相对URL的超链接。如将自己网页上的某一段文字或某标题链接到同一网站的其他网页上面去。
第三种称为同一网页的超链接。这种超链接又叫做书签。一般用#号加上名称链接到同一页面的指定地方。
在网页中,一般文字上的超链接都是蓝色(当然,用户也可以自己设置成其他颜色),文字下面有一条下划线。当移动鼠标指针到该超链接上时,鼠标指针就会变成一只手的形状,这时候用鼠标左键单击,就可以直接跳转到与这个超链接相连接的网页或WWW网站上去。如果用户已经浏览过某个超链接,这个超链接的文本颜色就会发生改变。只有图像的超链接访问后颜色不会发生变化。
我们平常应用的链接大多数是第一种类型。
链接标签的应用:
一、简单的链接:
制作链接文章,要从最简单的链接学起。最简单的链接,只要在“链接目标”处粘贴一个有效的地址,“内容”处输入几个文字或者一个小图片即可。
1、链接到一篇网页:
代码1:
<a href="http://www.360doc.com/content/13/0828/08/4127803_310398498.shtml" target=_blank>性与爱的艺术</a>
上面的代码中,在“链接目标”处粘贴了一篇文章的地址(等号后面的地址),在“内容”处输入了几个文字(在链接标签的“首标签”与“尾标签”之间输入了:性与爱的艺术)。页面显示的内容是:“性与爱的艺术”这几个文字。点击这些文字,就会弹出这篇文章的网页。
代码2:
<A title=姑娘你真美 href="http://www.360doc.com/content/13/1117/18/4127803_330029574.shtml" target=_blank><IMG style="BORDER-RIGHT-WIDTH: 0px; MARGIN: 0px; WIDTH: 126px; BORDER-TOP-WIDTH: 0px; BORDER-BOTTOM-WIDTH: 0px; HEIGHT: 98px; BORDER-LEFT-WIDTH: 0px" src="http://image68.360doc.com/DownloadImg/2014/01/1021/38170504_37"></A>
上面的代码中,在“链接目标”处粘贴了一篇文章的地址(等号后面的地址),“内容”处是一个图片标签。页面显示的内容是一个图片。用鼠标指向图片,还会显示出:“姑娘你真美”的文字。点击这个图片,就会进入一组图片的文章页面。
2、链接到一张图片:
代码:
<A href="http://image49.360doc.com/DownloadImg/2012/02/2406/21767605_14.jpg" target=_blank>美丽的剪纸</A>
上面的代码中,在“链接目标”处粘贴了一张图片的地址(等号后面的地址),在“内容”处输入了几个文字(在链接标签的“首标签”与“尾标签”之间输入了:美丽的剪纸)。页面显示的内容是:“美丽的剪纸”这几个文字。点击这些文字,就会弹出这张图片的网页。
3、链接到一个网站:
代码:
<A href="http://www./" target=_blank><IMG src="http://image.360doc.com/DownloadImg/1523/231385_1.jpg" width=96 height=120></A>
上面的代码中,在“链接目标”处粘贴了“百荷音画网站”的地址(等号后面的地址),在“内容”处粘贴了一张图片标签(在链接标签的“首标签”与“尾标签”之间)。页面显示的内容是:美女小图片。点击这个小图片,就会进入“百荷音画网站”。
4、链接到一篇视频:
代码:
<A href="http://www.360doc.com/content/14/0507/13/4127803_375490420.shtml" target=_blank>王玺雯太极刀(慢动作)</A>
上面的代码中,在“链接目标”处粘贴了一篇视频的地址(等号后面的地址),在“内容”处输入了几个文字(在链接标签的“首标签”与“尾标签”之间输入了:王玺雯太极刀 慢动作)。页面显示的内容是:“王玺雯太极刀 (慢动作)”这几个文字。点击这些文字,就会进入这篇视频的网页。
二、复杂的链接:
复杂的链接都是有若干个简单的链接重复制作而成的。复杂的链接,可以把链接标签与文字标签、图片标签、块区标签、段落标签、表格等标签组合起来应用。
1、网站的链接:
应用超链接,我们可以把其它网站的地址保存在我们的图书馆中,以便随时查看与使用。
2、文章地址的链接:
应用超链接,我们可以把许多文章的地址保存在我们的图书馆中,以便随时浏览。
3、友情链接:
应用超链接,我们可以把朋友的图书馆地址保存在自己的图书馆中,以方便联系。
举例:
<P align=center><FONT style="FONT-SIZE: 32px" color=#ff00ff><STRONG>好友通讯表</STRONG></FONT> </P>
<CENTER>
<TABLE style="BORDER-BOTTOM-STYLE: double; BORDER-BOTTOM-COLOR: rgb(2,132,0); TEXT-ALIGN: center; BORDER-TOP-COLOR: rgb(2,132,0); BORDER-LEFT-STYLE: double; WIDTH: 650px; BORDER-COLLAPSE: collapse; BORDER-TOP-STYLE: double; HEIGHT: 27px; BORDER-RIGHT-COLOR: rgb(2,132,0); BORDER-RIGHT-STYLE: double; BORDER-LEFT-COLOR: rgb(2,132,0)" border=5 cellSpacing=0 cellPadding=0 width=700>
<TBODY>
<TR style="TEXT-ALIGN: left">
<TD>
<DIV align=center><A style="COLOR: rgb(99,132,101)" class=nav3 href="http://www.360doc.com/userhome/5739036" target=_blank>LOVE天使的外婆</A></DIV></TD>
<TD>
<DIV align=center><A style="COLOR: rgb(99,132,101)" class=nav3 href="http://www.360doc.com/userhome/6860204" target=_blank>以勒。。</A></DIV></TD>
<TD>
<DIV align=center><A style="COLOR: rgb(99,132,101)" class=nav3 href="http://www.360doc.com/userhome/9496045" target=_blank>渔樵旧草庐</A></DIV></TD>
<TD style="TEXT-ALIGN: center">
<DIV align=center><A style="COLOR: rgb(99,132,101)" class=nav3 href="http://www.360doc.com/userhome/2710456" target=_blank>淡看生活</A></DIV></TD></TR>
<TR style="TEXT-ALIGN: left">
<TD>
<DIV align=center><A style="COLOR: rgb(99,132,101)" class=nav3 href="http://www.360doc.com/userhome/9642765" target=_blank>雪松书苑</A></DIV></TD>
<TD>
<DIV style="MARGIN-LEFT: 15px" align=center><A style="COLOR: rgb(99,132,101)" class=nav3 href="http://www.360doc.com/userhome/9269981" target=_blank>武当书苑</A></DIV></TD>
<TD>
<DIV style="MARGIN-LEFT: 15px" align=center><A style="COLOR: rgb(99,132,101)" class=nav3 href="http://www.360doc.com/userhome/7721621" target=_blank>相识是缘TWLK</A></DIV></TD>
<TD style="TEXT-ALIGN: center">
<DIV align=center><A style="COLOR: rgb(99,132,101)" class=nav3 href="http://www.360doc.com/userhome/9643160" target=_blank>凤宇书斋</A></DIV></TD></TR>
<TR style="TEXT-ALIGN: left">
<TD>
<DIV align=center><A style="COLOR: rgb(99,132,101)" class=nav3 href="http://www.360doc.com/userhome/7536829" target=_blank>銀花</A></DIV></TD>
<TD>
<DIV style="MARGIN-LEFT: 15px" align=center><A style="COLOR: rgb(99,132,101)" class=nav3 href="http://www.360doc.com/userhome/698455" target=_blank>木燕子</A></DIV></TD>
<TD>
<DIV style="MARGIN-LEFT: 15px" align=center><A style="COLOR: rgb(99,132,101)" class=nav3 href="http://www.360doc.com/userhome/7564225" target=_blank>静听心声851</A></DIV></TD>
<TD style="TEXT-ALIGN: center">
<DIV align=center><A style="COLOR: rgb(99,132,101)" class=nav3 href="http://www.360doc.com/userhome/6754783" target=_blank>远方的小燕子</A></DIV></TD></TR>
<TR style="TEXT-ALIGN: left">
<TD>
<DIV align=center><A style="COLOR: rgb(99,132,101)" class=nav3 href="http://www.360doc.com/userhome/2904667" target=_blank>dllc1234</A></DIV></TD>
<TD>
<DIV style="MARGIN-LEFT: 15px" align=center><A style="COLOR: rgb(99,132,101)" class=nav3 href="http://www.360doc.com/userhome/5302279" target=_blank>360doc小助手2</A></DIV></TD>
<TD>
<DIV style="MARGIN-LEFT: 15px" align=center><A style="COLOR: rgb(99,132,101)" class=nav3 href="http://www.360doc.com/userhome/2" target=_blank>360doc小助手</A></DIV></TD>
<TD style="TEXT-ALIGN: center">
<DIV align=center><A style="COLOR: rgb(99,132,101)" class=nav3 href="http://www.360doc.com/userhome/1490208" target=_blank>婉林</A></DIV></TD></TR>
<TR style="TEXT-ALIGN: left">
<TD>
<DIV align=center><A href="http://www.360doc.com/userhome/7563352" target=_blank><FONT color=#638465>wjl841</FONT></A></DIV></TD>
<TD>
<DIV style="MARGIN-LEFT: 15px" align=center><A style="COLOR: rgb(99,132,101)" class=nav3 href="http://www.360doc.com/userhome/6706641" target=_blank>审核小管家</A></DIV></TD>
<TD>
<DIV style="MARGIN-LEFT: 15px" align=center><A style="COLOR: rgb(99,132,101)" class=nav3 href="http://www.360doc.com/userhome/8871613" target=_blank>360doc小编辑</A></DIV></TD>
<TD style="TEXT-ALIGN: center">
<DIV style="MARGIN-LEFT: 15px" align=center><A style="COLOR: rgb(99,132,101)" class=nav3 href="http://www.360doc.com/userhome/1821013" target=_blank>也是绝顶苍松</A></DIV></TD></TR>
<TR style="TEXT-ALIGN: left">
<TD>
<DIV align=center><A href="http://www.360doc.com/userhome/3147467" target=_blank><FONT color=#638465>~我是一片云~</FONT></A></DIV></TD>
<TD>
<DIV style="MARGIN-LEFT: 15px" align=center><A style="COLOR: rgb(99,132,101)" class=nav3 href="http://www.360doc.com/userhome/9642765" target=_blank>雪松书苑</A></DIV></TD>
<TD>
<DIV style="MARGIN-LEFT: 15px" align=center><A style="COLOR: rgb(99,132,101)" class=nav3 href="http://www.360doc.com/userhome/260622" target=_blank>牙科渔翁</A></DIV></TD>
<TD style="TEXT-ALIGN: center">
<DIV style="margin-center: 15px" align=center><A style="COLOR: rgb(99,132,101)" class=nav3 href="http://www.360doc.com/userhome/7736960" target=_blank>秀清850</A></DIV></TD></TR>
<TR style="TEXT-ALIGN: left">
<TD>
<DIV align=center><A href="http://www.360doc.com/userhome/5004831" target=_blank><FONT color=#638465>娴情雅致</FONT></A></DIV></TD>
<TD>
<DIV align=center><A href="http://www.360doc.com/userhome/11650020" target=_blank><FONT color=#638465>神医图书馆318</FONT></A></DIV></TD>
<TD>
<DIV align=center><A href="http://www.360doc.com/userhome/5269384" target=_blank><FONT color=#638465>春天会来的</FONT></A></DIV></TD>
<TD style="TEXT-ALIGN: center"><A href="http://www.360doc.com/userhome/11945505" target=_blank><FONT color=#638465>连山老叟</FONT></A></TD></TR>
<TR style="TEXT-ALIGN: left">
<TD>
<DIV align=center><A href="http://www.360doc.com/userhome/3431107" target=_blank><FONT color=#638465>兰叶123</FONT></A></DIV></TD>
<TD>
<DIV align=center><A href="http://www.360doc.com/userhome/12167217" target=_blank><FONT color=#638465>白河人家669</FONT></A></DIV></TD>
<TD>
<DIV align=center><A href="http://www.360doc.com/userhome/13139409" target=_blank><FONT color=#638465>王氏书屋698</FONT></A></DIV></TD>
<TD style="TEXT-ALIGN: center">
<DIV align=center><A href="http://www.360doc.com/userhome/13484436" target=_blank><FONT color=#638465>彩虹的绚丽</FONT></A></DIV></TD></TR>
<TR style="TEXT-ALIGN: left">
<TD>
<DIV align=center><A href="http://www.360doc.com/userhome/10813888" target=_blank><FONT color=#638465>梅竹苑869</FONT></A></DIV></TD>
<TD>
<DIV align=center><A href="http://www.360doc.com/userhome/13573292" target=_blank><FONT color=#638465>乐观有趣</FONT></A></DIV></TD>
<TD>
<DIV align=center><A href="http://www.360doc.com/userhome/10118873" target=_blank><FONT color=#638465>翠明红枫</FONT></A></DIV></TD>
<TD style="TEXT-ALIGN: center">
<DIV align=center><A href="http://www.360doc.com/userhome/11587149" target=_blank><FONT color=#638465>巩华兰儿</FONT></A></DIV></TD></TR>
<TR style="TEXT-ALIGN: left">
<TD>
<DIV align=center>
<TABLE style="TEXT-ALIGN: left; WIDTH: 100%; HEIGHT: 27px" cellSpacing=0 cellPadding=0>
<TBODY>
<TR class=fajianli>
<TD class=fajianxz></TD>
<TD class=namelink>
<DIV align=center><A href="http://www.360doc.com/userhome/10432839" target=_blank><FONT color=#638465>莲友1972</FONT></A></DIV></TD></TR></TBODY></TABLE></DIV></TD>
<TD>
<DIV align=center><A href="http://www.360doc.com/userhome/18452#" target=_blank><FONT color=#638465>传播中医馆</FONT></A></DIV></TD>
<TD>
<DIV align=center><A href="" target=_blank><FONT color=#638465>待续</FONT></A></DIV></TD>
<TD style="TEXT-ALIGN: center">
<DIV align=center><A href="" target=_blank><FONT color=#638465>待续</FONT></A></DIV></TD></TR></TBODY></TABLE></CENTER>
4、展示自己的优秀文章:
应用超链接,我们可以把自己的优秀文章展示给朋友们,以方便朋友们阅读与收藏。
举例1:
这是用链接标签、文字标签与移动标签组合制作的“链接文字小模块”。点击其中的某篇文章标题,就会弹出此篇文章的网页。
举例2:
这是用链接标签、文字标签、表格标签、段落标签与块区组合制作的网页。点击其中的某个动画图片地址,就会弹出这个动画图片的网页,您可以欣赏与收藏。
举例3:
这是图书馆首页的一个模块作品。它综合应用了链接标签、文字标签、表格标签、段落标签与块区标签,把移动的链接文字添加到了一个图片中。
举例4:
这是一个书籍小模块,可以放置到图书馆首页。这个小模块是在表格标签中设置了一个空白书籍的背景图片,然后把文字输入到背景图片中。这个小模块也是链接标签、文字标签、表格标签、段落标签与块区标签的组合应用。
举例5:
这是一个精美的模块作品。综合应用了多种标签制作而成。
三、文章页面内部的链接:
有的文章篇幅比较长,当我们阅读到文章结尾处的时候,往往想返回到文章的开始处再阅读一次,这就需要拖动竖向滚动条,太麻烦啦!
如果我们在文章中制作一个“内部链接”,那就方便多啦。
制作文章内部链接的方法为:
在文章开头的“代码”中添加一个链接标签:<A name=顶部></A>,在文章结尾处的代码中,添加一个链接标签: <A href="#顶部"><FONT style="FONT-SIZE: 24px"><STRONG><EM>回到顶部</EM></STRONG></FONT></A> 就行啦。
第一个链接标签:<A name=顶部></A>中的name属性,是“名字”的意思,等号后面的属值是“顶部”。
第二个链接标签:<A href="#顶部"><FONT style="FONT-SIZE: 24px"><STRONG><EM>回到顶部</EM></STRONG></FONT></A>中的href属性,是链接的目标,等号后面的属值是“#顶部”,即跳转到顶部。这里的文字标签<FONT>、强调标签<STRONG>、斜体标签<EM>都可以不用。在这里我应用了这三种标签,为的是使链接文字大一些,粗一些,美观一些。
如果要制作“返回底部”的链接,只需把两个链接标签“交换”一下位置,把“顶部”二字修改为“底部”就行了。
代码:
<DIV align=center> <A name=顶部></A>
<TABLE border=2 cellSpacing=15 borderColor=#ff0099 width=880 background=http://image54.360doc.com/DownloadImg/2012/08/2616/26412535_1.jpg align=center>
<TBODY>
<TR>
<TD>
<TABLE style="WIDTH: 880px; TOP: 0px; LEFT: 0px" border=0 cellSpacing=0 borderColor=#ff0000 borderColorLight=#ffff00 borderColorDark=#ff0000 cellPadding=0 width=880 background=http://image54.360doc.com/DownloadImg/2012/08/2616/26412535_2.jpg height=660>
<TBODY>
<TR>
<TD width="50%">
<P align=right><FONT style="LINE-HEIGHT: normal; FONT-VARIANT: normal; FONT-STYLE: normal; FONT-SIZE: 30pt; FONT-WEIGHT: normal" color=#ff0000><STRONG>"春 天 没 来"</STRONG></FONT></P></TD>
<TD width="50%">
<P align=left><FONT style="LINE-HEIGHT: normal; FONT-VARIANT: normal; FONT-STYLE: normal; FONT-SIZE: 30pt; FONT-WEIGHT: normal" color=#ff0000><STRONG> 欢 迎 您</STRONG></FONT></P></TD>
<TR>
<TD width="50%"><EMBED height=300 type=application/x-shockwave-flash align=right width=440 src=http://www./cc/flash/143.swf allowScriptAccess="never" allowNetworking="internal" quality="high" menu="false" wmode="transparent"></TD>
<TD width="50%"><EMBED height=300 type=application/x-shockwave-flash align=right width=440 src=http://www./cc/flash/143.swf allowScriptAccess="never" allowNetworking="internal" quality="high" menu="false" wmode="transparent"></TD>
<TR>
<TR>
<TD width="50%"><EMBED height=310 type=application/x-shockwave-flash align=right width=440 src=http://mylib./userfile/12410834/2011-05-11/1305113553156.swf allowScriptAccess="never" allowNetworking="internal" quality="high" menu="false" wmode="transparent"></TD>
<TD width="50%"><EMBED height=310 type=application/x-shockwave-flash align=right width=440 src=http://mylib./userfile/12410834/2011-05-11/1305113553156.swf allowScriptAccess="never" allowNetworking="internal" quality="high" menu="false" wmode="transparent"></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE></DIV>
<P></P>
<DIV><FONT style="FONT-SIZE: 24px" color=#ff0000><STRONG>代码:</STRONG></FONT><BR><div align="center"><BR><table border="2" cellSpacing="15" borderColor="#ff0099" width="880" background="<A href="http://image54.360doc.com/DownloadImg/2012/08/2616/26412535_1.jpg">http://image54.360doc.com/DownloadImg/2012/08/2616/26412535_1.jpg</A>" align="center"><BR><tbody><BR><tr><BR><td><BR><table style="left: 0px; top: 0px; width: 880px;" border="0" cellSpacing="0" borderColor="#ff0000" borderColorLight="#ffff00" borderColorDark="#ff0000" cellPadding="0" width="880" background="<A href="http://image54.360doc.com/DownloadImg/2012/08/2616/26412535_2.jpg">http://image54.360doc.com/DownloadImg/2012/08/2616/26412535_2.jpg</A>" height="660"><BR><tbody><BR><tr><BR><td width="50%"><p align="right"><font style="line-height: normal; font-size: 30pt; font-style: normal; font-variant: normal; font-weight: normal;" color="#ff0000"><strong>"春 天 没 来"</strong></font></p></td><BR><td width="50%"><p align="left"><font style="line-height: normal; font-size: 30pt; font-style: normal; font-variant: normal; font-weight: normal;" color="#ff0000"><strong> 欢 迎 您</strong></font></p></td><BR><tr><BR><td width="50%"><embed height="300" type="application/x-shockwave-flash" align="right" width="440" src="<A href="http://www./cc/flash/143.swf">http://www./cc/flash/143.swf</A>" allowScriptAccess="never" allowNetworking="internal" quality="high" menu="false" wmode="transparent"></td><BR><td width="50%"><embed height="300" type="application/x-shockwave-flash" align="right" width="440" src="<A href="http://www./cc/flash/143.swf">http://www./cc/flash/143.swf</A>" allowScriptAccess="never" allowNetworking="internal" quality="high" menu="false" wmode="transparent"></td><BR><tr><BR><tr><BR><td width="50%"><embed height="310" type="application/x-shockwave-flash" align="right" width="440" src="<A href="http://mylib./userfile/12410834/2011-05-11/1305113553156.swf">http://mylib./userfile/12410834/2011-05-11/1305113553156.swf</A>" allowScriptAccess="never" allowNetworking="internal" quality="high" menu="false" wmode="transparent"></td><BR><td width="50%"><embed height="310" type="application/x-shockwave-flash" align="right" width="440" src="<A href="http://mylib./userfile/12410834/2011-05-11/1305113553156.swf">http://mylib./userfile/12410834/2011-05-11/1305113553156.swf</A>" allowScriptAccess="never" allowNetworking="internal" quality="high" menu="false" wmode="transparent"></td></tr></tbody></table></td></tr></tbody></table></div></DIV>
<DIV>
<DIV><FONT style="FONT-SIZE: 21px" color=#ff0000><STRONG>代码解析:</STRONG></FONT></DIV>
<DIV>1、在二重表格中,设置了一个三行二列,表格的宽度880px,高度660px(这一点很重要,表格的规格一定要和背景图片<A href="http://image54.360doc.com/DownloadImg/2012/08/2616/26412535_2.jpg">http://image54.360doc.com/DownloadImg/2012/08/2616/26412535_2.jpg</A>的规格相同)。</DIV>
<DIV>2、第一行的第一个单元格内,放入了文字:“春天没来”,文字的对齐方式为“居右”;第二个单元格内,放入了文字:欢迎您,文字的对齐方式为“居左”。整行文字的效果是“居中”。</DIV>
<DIV>3、第二行的两个单元格内,各放入了一个动画图片,动画图片的宽度都是440,合起来为880,等于表格的宽度;高度为310。</DIV>
<DIV>4、第三行的两个单元格内,各放入了一个动画图片,动画图片的宽度都是440,合起来为880,等于表格的宽度;高度为310。</DIV>
<DIV>5、两行动画图片的高度和一行文字的高度加起来,正好是660(文字的高度50是经过试验确定的)。</DIV>
<DIV> </DIV></DIV>
<DIV align=left><FONT style="FONT-SIZE: 21px" color=#ff0000><STRONG>代码解析:</STRONG></FONT></DIV>
<DIV align=left></DIV>
<DIV align=left>1、在二重表格中,设置了一个三行二列,表格的宽度880px,高度660px(这一点很重要,表格的规格一定要和背景图片<A href="http://image54.360doc.com/DownloadImg/2012/08/2616/26412535_2.jpg">http://image54.360doc.com/DownloadImg/2012/08/2616/26412535_2.jpg</A>的规格相同)。</DIV>
<DIV align=left></DIV>
<DIV align=left>2、第一行的第一个单元格内,放入了文字:“春天没来”,文字的对齐方式为“居右”;第二个单元格内,放入了文字:欢迎您,文字的对齐方式为“居左”。整行文字的效果是“居中”。</DIV>
<DIV align=left></DIV>
<DIV align=left>3、第二行的两个单元格内,各放入了一个动画图片,动画图片的宽度都是440px,合起来为880px,等于表格的宽度;高度为310px。</DIV>
<DIV align=left></DIV>
<DIV align=left>4、第三行的两个单元格内,各放入了一个动画图片,动画图片的宽度都是440px,合起来为880px,等于表格的宽度;高度为310px。</DIV>
<DIV align=left></DIV>
<DIV align=left>5、两行动画图片的高度和一行文字的高度加起来,正好是660px(文字的高度50px是经过试验确定的)。</DIV>
<DIV align=right></DIV>
<DIV align=right>
<MARQUEE direction=right scrollAmount=2><IMG src="http://image27.360doc.com/DownloadImg/2011/04/2414/11183843_1.gif"> <IMG src="http://image27.360doc.com/DownloadImg/2011/04/2414/11183843_1.gif"> <IMG src="http://image27.360doc.com/DownloadImg/2011/04/2414/11183843_1.gif"> <IMG src="http://image27.360doc.com/DownloadImg/2011/04/2414/11183843_1.gif"></MARQUEE></DIV>
<DIV align=right> </DIV>
<DIV align=right><A href="http://www.360doc.com/userhome/4127803" target=_blank><IMG src="http://userimage2.360doc.com/12/0710/06/4127803_201207100648100037.jpg"></A> </DIV> <A href="#顶部"><FONT style="FONT-SIZE: 24px"><STRONG><EM>回到顶部</EM></STRONG></FONT></A>
<DIV align=right><FONT style="FONT-SIZE: 32px" color=#ff0000><STRONG>2012年9月22日于北京</STRONG></FONT><BR></DIV>
上面的代码是我制作的一篇“文章内部链接”的文章代码。代码中有两处红色的代码,您可查看一下,体会一下制作“文章内部链接”的方法。
作业:
1、理解链接标签的重要性。学会应用链接标签制作网页。
2、解析链接标签: <a href="要链接的网址" target=_blank>内容</a>
3、应用链接标签,收藏几篇其它网站的文章。
4、应用链接标签,收藏几个你喜欢的网站。
5、把你图书馆中的优秀文章,制作一篇链接网页。
6、把你图书馆中的优秀文章,制作一个小模块,添加到你的图书馆首页。
7、试着制作一个文章内部的链接。
学习代码,重在理解,重在练习,重在制作,还要不断地记录制作笔记,把你应用代码制作网页的体会记录下来。这是你学习代码的一笔宝贵财富。如果你只收藏《教程》,不理解,不练习,不制作,也不作记录笔记,那是永远学不会代码的。
——“春天没来”谨启
“春天没来”编撰
2014年5月9日于北京

    本站是提供个人知识管理的网络存储空间,所有内容均由用户发布,不代表本站观点。请注意甄别内容中的联系方式、诱导购买等信息,谨防诈骗。如发现有害或侵权内容,请点击一键举报。
    转藏 分享 献花(0

    0条评论

    发表

    请遵守用户 评论公约

    类似文章 更多