您好!欢迎您光临本站! 体育 I 论坛 I 交友 I

会员注册

I

本站搜索

I

收藏本站

当前位置:首页 >>>音画制作>>>HTML(音画)帖子制作教程>>>如何用HTML 装饰自己的文章
如何用HTML 装饰自己的文章
发表日期:2006/7/18 15:14:00 出处:未知 作者:心韵编辑 发布人:gxlan88 已被访问 1988

 

     一、何为HTML

     HTML(HyperTextMark-upLanguage)即超文本标记语言,是WWW的描述语言。它是用于创建可从一个平台移植到另一平台的超文本文档的一种简单标记语言,经常用来创建Web页面。通俗讲,设计HTML语言的目的是为了能把存放在一台电脑中的文本或图形与另一台电脑中的文本或图形方便地联系在一起,形成有机的整体,人们不用考虑具体信息是在当前电脑上还是在网络的其它电脑上。我们只需使用鼠标在某一文档中点取一个图标,Internet就会马上转到与此图标相关的内容上去,而这些信息可能存放在网络的另一台电脑中。 HTML文本是由HTML命令组成的描述性文本,HTML命令可以说明文字、图形、动画、声音、表格、链接等。

    HTML的结构包括头部(Head)、主体(Body)两大部分,其中头部描述浏览器所需的信息,而主体则包含所要说明的具体内容。

    上面所提到的“WWW”是一个专用术语,用于描述Internet上的所有可用信息和多媒体资源。可以使用一个被称为Web浏览器的应用程序来访问这些信息。

    二、HTML的组成结构

    1、头部 head 的HTML写法就是: <head>头部的内容</head>

    2、标题,title 其表示语法:<title>标题</title>,它是包括<head></head>之间。也属于第一部分内容。

    例如: <head><title>标题</title></head>

    3、主体:BODY 其表示语法为:  <body>页面内容</body>

4、将上述三个内容包括于“<html></html>中间,就大体构成了一个html网页结构代码。

例如:

<html>

 <head>

   <title>

   标题

   </title>

 </head>

 <body>

 页面内容

 </body>

</html>

    三、表格

   我们要学习的就是在HTML编辑状态下的表格制作。在这里我们暂时不去学习表格各种标识符号和代码,先来利用它山之石,体验一下寻找整个网页代码的乐趣。不要着急,即使你一点也不懂代码,也没关系,只要你认真按照我说的步骤去做,你一定能成功的。

    首先,我来给大家做一个演示:

    第一步:打开一个网页: 爱的礼赞  (心缘之梦——网友心曲——散文随笔栏目)

    第二步:点打开该网页上方的,也就是你的电脑工具栏中的“查看”,会出现一个下拉菜单,点击其中的“源文件”便出现一个“记事本”对话框,这里面就是这个网页的全部代码。

如下:

<html>
<head>
<title>心缘之梦</title>
<style type="text/css">
<!--
/*一般格式*/
BODY {font-size: 9pt; font-family: 宋体; color: #003366;
scrollbar-Base-Color: #faf6fd;
SCROLLBAR-TRACK-COLOR: #faf6fd; 
SCROLLBAR-HIGHLIGHT-COLOR: #faf6fd;
SCROLLBAR-FACE-COLOR: #dfc7f2;
SCROLLBAR-SHADOW-COLOR: #dfc7f2;
SCROLLBAR-3DLIGHT-COLOR: #dfc7f2;
SCROLLBAR-DARKSHADOW-COLOR: #808080;
SCROLLBAR-ARROW-COLOR: #ff0000;}
INPUT             {BACKGROUND-COLOR: #ffffff; BORDER-BOTTOM: #89a5e6 1px solid; BORDER-LEFT: #89a5e6 1px solid; BORDER-RIGHT: #89a5e6 1px solid; BORDER-TOP: #89a5e6 1px solid; COLOR: #082D71;  HEIGHT: 18px; border-color: #082D71 #082D71 #082D71 #082D72; font-size: 9pt}
select            {color: #082D71; background-color: #ffffff; border-color: #082D71 #082D71 #082D71 #082D72; font-size: 9pt}
textarea          {color: #082d71; background-color: #ffffff}
TR {font-family: 宋体; font-size: 9pt}
TD {font-family: 宋体; font-size: 9pt;}
B { FONT-WEIGHT: bold }
font,div,p,body,span,td,th { line-height: 150% ; word-break: break-all}

/*链接格式*/
A:link { text-decoration : none; font-weight : normal; color : #003366; font-family: 宋体; }
A:active { text-decoration : none; font-weight : normal; color : #0066cc; font-family: 宋体; }
A:visited { text-decoration : none; font-weight : normal; color : #003366; font-family: 宋体; }
A:hover { text-decoration : underline; font-weight : normal; color : #0066cc; font-family: 宋体; }

/*网站黑边table*/
.tabBlackBorder1 {BORDER-BOTTOM: #000000 1px solid; BORDER-LEFT: #000000 1px solid; BORDER-RIGHT: #000000 1px solid; BORDER-TOP: #000000 1px solid}
.tabBlackBorder2 {BORDER-BOTTOM: #000000 0px solid; BORDER-LEFT: #000000 1px solid; BORDER-RIGHT: #000000 1px solid; BORDER-TOP: #000000 1px solid}
.tabBlackBorder3 {BORDER-BOTTOM: #000000 1px solid; BORDER-LEFT: #000000 1px solid; BORDER-RIGHT: #000000 1px solid; BORDER-TOP: #000000 0px solid}
.tabBlackBorder4 {BORDER-BOTTOM: #000000 1px solid; BORDER-LEFT: #000000 0px solid; BORDER-RIGHT: #000000 0px solid; BORDER-TOP: #000000 1px solid}
.tabBlackBorder5 {BORDER-BOTTOM: #000000 2px solid; BORDER-LEFT: #000000 2px solid; BORDER-RIGHT: #000000 2px solid; BORDER-TOP: #000000 1px solid}
.tabBlackBorder6 {BORDER-BOTTOM: #000000 2px solid; BORDER-LEFT: #000000 2px solid; BORDER-RIGHT: #000000 2px solid; BORDER-TOP: #000000 0px solid}

/* menu bar */
.menu                {FONT-FAMILY: 宋体; background-image:url("http://www.2000y.net/moban/25/left_bg.gif");}
.menu A:link               {FONT-FAMILY: 宋体; COLOR: #000000; FONT-SIZE: 12px; TEXT-DECORATION: none; BACKGROUND: none;  font-variant : normal;}
.menu A:active             {FONT-FAMILY: 宋体; COLOR: #000000; FONT-SIZE: 12px; TEXT-DECORATION: underline; BACKGROUND: none;  font-variant : normal;}
.menu A:visited            {FONT-FAMILY: 宋体; COLOR: #000000; FONT-SIZE: 12px; TEXT-DECORATION: none; BACKGROUND: none;  font-variant : normal;}
.menu A:hover              {FONT-FAMILY: 宋体; COLOR: #0066cc; FONT-SIZE: 12px; TEXT-DECORATION: underline; BACKGROUND: none;  font-variant : normal;}

.menu td{background-image:url("http://www.2000y.net/moban/25/left_bg.gif");border:solid 1px #faf6fd;}

/*网站标题*/
.bigtitle { font-family: 宋体;FONT-SIZE: 24pt; height:bold; COLOR: #003366; FONT-WEIGHT: bold; FILTER: DropShadow(Color=black, OffX=0, OffY=0, Positive=0); WIDTH: 100% }


/*表的标题*/
.tabar {font-family: 宋体; FONT-WEIGHT: bold; font-size: 9pt; color: #000000; BACKGROUND-color: transparent; text-decoration: none }

.left_1 {background-image:url("http://www.2000y.net/moban/25/left_bg1.gif"); border: solid 1px #dfc7f2; font-size:13px; font-weight:bold}
.left_2 {border: solid 1px #dfc7f2;  background-color:#faf6fd; font-size:12px}
.center_1 {background-image:url("http://www.2000y.net/moban/25/left_bg1.gif"); border: solid 1px #dfc7f2; font-size:13px; font-weight:bold}
-->
</style>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
</head>
<body background='uploadpic/2005111501374852284.gif' leftmargin="0" topmargin="0" marginwidth="0" marginheight="0" rightMargin=0>
<center>
<table width="778" border="0" cellspacing="0" cellpadding="0" align="center">
    <tr><td><table width=778 border=0 cellspacing=0 cellpadding=0 align=center>
<tr><td>
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#

version=5,0,0,0" width=778 height=102>
<param name="movie" value="uploadpic/2004111422495337252.swf">
<param name="quality" value="high">
<embed src="uploadpic/2004111422495337252.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width=778 height=102>
</embed></object></td></tr></table><script language=javascript src="http://a.keyrun.com/pcode.php?username=xyzm&repl=1&adsuser=my100to&adsid=193&iw=760&ih=80"></script><script language = "JavaScript" src = "Main.js"></script><div class=menuskin id=popmenu onmouseover="clearhidemenu();highlightmenu(event,'on')"  onmouseout="highlightmenu(event,'off');dynamichide(event)" style="Z-index:100"></div></td></tr>
    <tr> <td class="menu"><table width=100% border=0 cellspacing=1 cellpadding=0 class=menu align=center>
<tr>
<td height=22 width=12.5%  align=center>
<a href="index.asp" title='返回网站首页'>网站首页</a>
</td>
<td width=12.5% align=center height=22><a href="index.asp?xAction=xBigclass&bigclassid=41" title='有关本网站文章贴子' >心缘家务</a></td>
<td width=12.5% align=center height=22><a href="index.asp?xAction=xBigclass&bigclassid=17" title='圣诞、元旦、春节' >温馨祝福</a></td>
<td width=12.5% align=center height=22><a href="index.asp?xAction=xBigclass&bigclassid=16" title='心缘之梦是您的家' >情感空间</a></td>
<td width=12.5% align=center height=22><a href="index.asp?xAction=xBigclass&bigclassid=2" title='畅谈网海之中的心缘之梦' >网海缘梦</a></td>
<td width=12.5% align=center height=22><a href="index.asp?xAction=xBigclass&bigclassid=4" title='图文音乐大组合' >养眼画廊</a></td>
<td width=12.5% align=center height=22><a href="index.asp?xAction=xBigclass&bigclassid=6" title='网友原创与转帖作品' >网友心曲</a></td>
<td width=12.5% align=center height=22><a href="index.asp?xAction=xBigclass&bigclassid=12" title='逗你开心、为你排忧、知识解答等' >随心驿站</a></td>
</tr>
<tr>
<td width=12.5% align=center height=22><a href="index.asp?xAction=xBigclass&bigclassid=46" title='家是温柔港湾' >温柔港湾</a></td>
<td width=12.5% align=center height=22><a href="index.asp?xAction=xBigclass&bigclassid=7" title='flash 、动画歌曲欣赏' >flash动画</a></td>
<td width=12.5% align=center height=22><a href="index.asp?xAction=xBigclass&bigclassid=25" title='朗诵欣赏' >朗诵欣赏</a></td>
<td width=12.5% align=center height=22><a href="index.asp?xAction=xBigclass&bigclassid=15" title='轻音乐、在线歌曲视听' >音乐海岸</a></td>
<td width=12.5% align=center height=22><a href="index.asp?xAction=xBigclass&bigclassid=42" title='心缘家人康是我们的关爱' >祝您健康</a></td>
<td width=12.5% align=center height=22><a href="index.asp?xAction=xBigclass&bigclassid=9" title='电脑知识、网页制作、素材库等' >网页知识</a></td>
<td width=12.5% align=center height=22><a href="http://www.xyzm.com/index.asp?xAction=xSmallclass&bigclassid=9&smallclassid=167" title="网页素材" target='_blank'>网页素材</a></td>
<td width=12.5% align=center height=22><a href="index.asp?xAction=xBigclass&bigclassid=53" title='主要是与电脑相关的知识' >电脑学苑</a></td>
</tr>
<tr>
<td width=12.5% align=center height=22><a href="index.asp?xAction=xBigclass&bigclassid=35" title='主要发表、转帖有关孩子教育、教育方法等方面的文章' >教育天地</a></td>
<td width=12.5% align=center height=22><a href="index.asp?xAction=xBigclass&bigclassid=40" title='有关网络研究的帖子' >网络文化</a></td>
<td width=12.5% align=center height=22><a href="index.asp?xAction=xBigclass&bigclassid=34" title='新人新作' >新人新作</a></td>
<td width=12.5% align=center height=22><a href="http://bbs.xyzm.com" title="情感重地" target='_blank'>心缘论坛</a></td>
<td width=12.5% align=center height=22><a href="http://whzq999.2000y.net/" title="心缘之梦分站" target='_blank'>心缘分站</a></td>
<td width=12.5% align=center height=22><a href="http://2008wlkw.2000y.net" title="黑马在线动力交互版" target='_blank'>黑马在线</a></td>
<td width=12.5% align=center height=22><a href="http://pingdanshifu.2000y.net/" title="做一个心缘之梦,饮一杯飘香的清茶" target='_blank'>一杯清茶</a></td>
<td width=12.5% align=center height=22><a href="http://www.xyzm.com/index.asp?xAction=xSmallclass&bigclassid=34&smallclassid=312" title="写作知识" target='_blank'>写作知识</a></td>
</tr>
<tr>
<td width=12.5% align=center height=22><a href="index.asp?xAction=xreadnews&NewsID=7156" title="温馨小屋" target='_blank'>温馨小屋</a></td>
<td width=12.5% align=center height=22><a href="http://222.185.225.112/roomlogin.aspx?roomid=xyzm9999" title="心缘教室" target='_blank'>心缘教室</a></td>
<td width=12.5% align=center height=22> </td>
<td width=12.5% align=center height=22> </td>
<td width=12.5% align=center height=22> </td>
<td width=12.5% align=center height=22> </td>
<td width=12.5% align=center height=22> </td>
<td width=12.5% align=center >
<a href=index.asp?xAction=xGuestbook title='有事请说话'>留 言 板</a></td>
</tr>
</table>
</td></tr>
    <tr><td class="menu"><table width=100% border=0 cellspacing=1 cellpadding=0 align=center>
<tr >
<td height=25><marquee scrolldelay=5 scrollamount=2>
<FONT color=#ffffff><B><FONT   color=#0000FF size=3> 亲爱的朋友真诚欢迎您!您的加入使心缘之梦更具魅力与风采!我们期待着和您相识相知,携手共建这个美好的网上家园!本站有两个域名可以登陆:国际域名:http://www.xyzm.com/ 二级域名:http://cxts16yzmb05.2000y.net/</font></marquee></td>
</tr>
</table>
</td></tr>
    <tr><td bgcolor="#000000" height="1"></td></tr>
</table>
<table width="778" border="0" cellspacing="0" cellpadding="0">
    <tr>
        <td height="30" bgcolor="#faf6fd" > 当前位置:<a href="index.asp" title='返回网站首页'>首页</a>&nbsp;&gt;&gt;&nbsp;<a href=index.asp?xAction=xBigclass&bigclassid=6 title=网友原创与转帖作品>网友心曲</a>&nbsp;&gt;&gt;&nbsp;<a href=index.asp?xAction=xSmallclass&bigclassid=6&smallclassid=20 title='网友原创作品'>散文随笔</a>&nbsp;&gt;&gt;&nbsp;<a href=index.asp?xAction=xReadnews&newsid=22049  title='爱的礼赞'>爱的礼赞</a>
</td>
        <td align="right" bgcolor="#faf6fd" ><table><form method=post name=myform action=index.asp?xAction=xResult target=newwindow>
<tr><td><select name=action size=1>
<option selected value=all>全部内容</option>
<option value=title>按文章标题</option>
<option value=editor>按发布人</option>
<option value=content>按文章内容</option>
<option value=author>按文章作者</option>
</select> <input type=text name=keyword size=10 value=关键字 onfocus="if (value =='关键字'){value =''}" onblur="if (value ==''){value='关键字'}" maxlength=50> <input type=submit name=Submit value=搜索>&nbsp;&nbsp;</td></tr></form></table>
</td>
    </tr>
</table>
<table width="778" border="0" cellpadding="0" cellspacing="0">
    <tr><td bgcolor="#000000" height="1"></td></tr>
</table>
<table width="778" border="0" cellspacing="0" cellpadding="0" align="center">
<tr valign="top">
<td width="160" bgcolor="#faf6fd"></td><td></td>
<td width="100%" bgcolor="#faf6fd" align=center><table border=0 cellpadding=0 cellspacing=1 width=99% height=20 align=center>
<tr><td width=100% >
<SCRIPT language=JavaScript>
var currentpos,timer;
function initialize(){timer=setInterval("scrollwindow()",50);}
function sc(){clearInterval(timer);}
function scrollwindow(){currentpos=document.body.scrollTop;window.scroll(0,++currentpos);if (currentpos != document.body.scrollTop)sc();}
document.onmousedown=sc
document.ondblclick=initialize
</script>
<table width=100% border=0 cellspacing=0 cellpadding=0  align=center>
<tr><td width=20% height=22>&nbsp;</td>
<td width=20% align=center>双击自动滚屏</td>
<td width=20% align=center><input type=button name=print value=打印本页  onClick="javascript:window.print()"></td>
<td width=20% align=center><input type=button name=close value=关闭窗口  onClick="window.close();return false;"></td>
<td width=20% >&nbsp;</td>
</tr></table>
<table border=0 width=100% align=center cellspacing=1 cellpadding=0><tr><td width=99% align=middle valign=top>
<table border=0 width=100% cellpadding=0 cellspacing=0><tr><td width=100% align=middle valign=top>
<table border=1 cellpadding=0 cellspacing=0 width=100% align=center bordercolor=#AECAAE>
<tr><td width=100% align=center style=font-size:18px height=60 valign=bottom bordercolor=#FFFFFF><strong><font face=楷体_GB2312 size=5 color=#000000><b>爱的礼赞</b></font></strong></td></tr>
<tr><td width=100% align=center bordercolor=#FFFFFF><hr width=100% align=center noshade size=1></td></tr>
<tr><td width=100% align=center style=font-size:9pt bordercolor=#FFFFFF>发表日期:2005年12月19日&nbsp;&nbsp;作者:大梦觉醒&nbsp;&nbsp;本页面已被访问 49 次</td></tr>
<tr><td width=100%  align=center bordercolor=#FFFFFF>
    <table width=100% border=0 cellspacing=0 cellpadding=0 align=center style="TABLE-LAYOUT: fixed">  (注:该文章的代码开始)
    <tr><td style="WORD-WRAP: break-word"><br>
<TABLE id=table1 style="LEFT: -100px; WIDTH: 970px; POSITION: relative; TOP: 0px" borderColor=#cccccc cellSpacing=30 cellPadding=3 background=http://www.citychinese.com/bbs/UploadFile/2005-9/200592610191743919.jpg border=0>
<TBODY>
<TR>
<TD>
<TABLE borderColor=#cccccc cellSpacing=10 cellPadding=3 width="100%" background=http://sucai.heima.com/sucai/material/paper2002/paper01/0104/

kabe/kabe001/ba_a20.gif border=0>
<TBODY>
<TR>
<TD>
<TABLE borderColor=#cccccc cellSpacing=20 cellPadding=3 width="100%" background=http://www.citychinese.com/bbs/UploadFile/2005-9/200592610191743919.jpg border=0>
<TBODY>
<TR>
<TD>
<TABLE borderColor=#cccccc cellSpacing=30 cellPadding=3 width="100%" background=http://www.citychinese.com/bbs/UploadFile/2005-9/200592610185582295.jpg border=0>
<TBODY>
<TR>
<TD><BR>
<P align=center><FONT style="FONT-SIZE: 50pt; FILTER: shadow(color=#FFFF00); WIDTH: 439px; COLOR: #f90b46; LINE-HEIGHT: 150%; FONT-FAMILY: 隶书; HEIGHT: 88px" face=楷体_GB2312 color=#000000 size=5><B>爱 的 礼 赞</B></FONT></P><BR><BR><BR>
<P align=center><FONT face=楷体_GB2312 color=#daa520 size=5>文章/大梦觉醒&nbsp; 编辑/蝶儿<BR></FONT></B><BR><BR></P>
<P align=center>
<TABLE>
<TBODY>
<TR>
<TD width=400 background=http://images.quanjing.com/age_FS7/high/F58-199800.jpg height=250><EMBED pluginspage=http://www.macromedia.com/go/getflashplayer align=center src=http://imgfree.21cn.com/free/flash/4.swf width=400 height=250 type=application/x-shockwave-flash wmode="transparent" quality="high"></EMBED></TD></TR></TBODY></TABLE></P>
<P align=left><BR><FONT color=#deb887><FONT face=新宋体 size=5>&nbsp;&nbsp; 让爱供奉在我们灵魂的殿堂,就像美丽的花朵盛开在心灵的窗口,能幸福自己,亦能幸福许多人。&nbsp;爱是灵魂的内核,爱是人心的旗帜,爱是真善美的源泉,爱也是一种涂料,给这个世界涂抹着天堂的色彩。&nbsp;</FONT></FONT></P><FONT color=#deb887><FONT face=新宋体 size=5>
<P align=left><BR>&nbsp;&nbsp;&nbsp;&nbsp;在生命你中有我,我中有你的敬畏中,我深深地懂得了爱。幸福装在叫****的百宝箱里,只有爱才是生活的最高动机,才使我们短暂的生命转化为永恒的忘我境界,才使我们的存在具有实在的意义。</P>
<P align=left><BR>&nbsp;&nbsp;&nbsp;&nbsp;爱本质上是一种给予,而爱的幸福就在给予之中。爱的给予既不是奉献,亦不是施舍,它是一种内在的丰盈的情愫自然而然的流溢,是超越于道德和功利的。爱如同光源,爱者的幸福就在于普照万物;爱如同鲜花,爱者的幸福就在于散发出芬芳;爱如同甘泉,爱者的幸福就在于润泽大地。纪伯伦这样阐述爱:“爱除自身外无施与,除自身外无接受,爱不占有,也不被占有。因为爱在爱中满足了。”丰盈的爱使人像神一样博大。 <BR></FONT><BR></P></FONT></B><BR><BR>
<TABLE align=center>
<TBODY>
<TR>
<TD width=400 background=http://images.quanjing.com/130/high/2936.jpg height=250>
<DIV align=center><EMBED pluginspage=http://www.macromedia.com/go/getflashplayer align=center src=http://imgfree.21cn.com/free/flash/4.swf width=400 height=250 type=application/x-shockwave-flash quality="high" wmode="transparent"></DIV></EMBED></TD></TR></TBODY></TABLE>
<P>&nbsp;</P>
<P><BR><FONT face=新宋体 color=#deb887 size=5>&nbsp;&nbsp; 爱是最美丽的人性之光。爱营造的是友善、宽容、和平、和谐和温情的氛围;爱化解的是冷漠、隔阂、仇视、伤害和争斗。哪里有爱,哪里就有温暖,就有和谐。我企盼着每一颗心灵都充满爱,让爱凝聚成一轮光华四射的太阳,照耀着这个世界的每一个角落。</FONT></P>
<P><FONT face=新宋体 color=#deb887 size=5><BR>&nbsp;&nbsp;&nbsp;&nbsp;爱能让黄莲变得甘之如饴,苦酒酿成玉液琼浆。爱会让你爱现在和将来的每一个时刻,使你的意识中充满了美的感觉、美的享受。在爱中,你会发现,人世间所有的美好都降临到了你身上。</FONT></P>
<P><FONT face=新宋体 color=#deb887 size=5><BR>&nbsp;&nbsp;&nbsp;&nbsp;爱的唤醒是人类生命最最需要的馈赠。宇宙间存在的一切都是为了让人类学会爱。人类创造的一切文明,凝结的最珍贵的经验,最有价值的经验,那就是爱。&nbsp;</FONT></P>
<P><FONT face=新宋体 color=#deb887 size=5><BR>&nbsp;&nbsp;&nbsp;&nbsp;爱是人类灵魂神秘的力量,是人类独有的生命意识。爱穿越我们的肉身,飞升在人类精神的天空,无比高贵地蒸馏和清洁着我们俗常的生活,使我们的生命浓郁起来、跳跃起来、丰美起来。&nbsp;<BR><BR>&nbsp;&nbsp; <BR></P></FONT></B><BR><BR><EMBED src=http://att1.ccmove.com/ring/2/2005930_133029312582.mp3 width=400 height=40 hidden=true type=audio/x-pn-realaudio-plugin controls="controlpanel,statusbar" autostart="true" loop="true">
<TABLE align=center>
<TBODY>
<TR>
<TD width=400 background=http://images.quanjing.com/140/high/12500.jpg height=300>
<DIV align=center><EMBED pluginspage=http://www.macromedia.com/go/getflashplayer align=center src=http://imgfree.21cn.com/free/flash/4.swf width=400 height=300 type=application/x-shockwave-flash wmode="transparent" quality="high"></DIV></EMBED></TD></TR></TBODY></TABLE><BR><BR>
<DIV></DIV>
<P></P>
<DIV><FONT face=新宋体 color=#deb887 size=5></FONT></DIV>
<P><FONT face=新宋体 color=#deb887 size=5></FONT></P>
<DIV><FONT face=新宋体 color=#deb887 size=5></FONT></DIV>
<P><FONT face=新宋体 color=#deb887 size=5></FONT></P>
<P align=center><FONT face=新宋体 color=#deb887 size=5></FONT>&nbsp;</P><BR><BR>
<P align=center><BR><FONT face=新宋体 color=#deb887 size=5><IMG alt="" src="http://www.xyzm.com/uploadpic/2005080421133683020.gif" onload="javascript:if(this.width>screen.width-333)this.width=screen.width-333" border=0>&nbsp;</FONT></P></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE>

</TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE>    <br></td></tr></table>
</td></tr>
<tr><td width=100% bordercolor=#FFFFFF><hr size=1></td></tr>
<tr><td height=3 bordercolor=#FFFFFF></td></tr>
</table>
</td></tr></table>
</td></tr></table>(该文章代码的结束)
<table width=100% border=0 cellspacing=0 cellpadding=0  align=center>
<tr><td width=20% height=22>&nbsp;</td>
<td width=20% align=center>双击自动滚屏</td>
<td width=20% align=center><input type=button name=print value=打印本页  onClick="javascript:window.print()"></td>
<td width=20% align=center><input type=button name=close value=关闭窗口  onClick="window.close();return false;"></td>
<td width=20% >&nbsp;</td>
</tr></table>
<table width=100% border=0 cellspacing=0 cellpadding=0  align=center>
<tr><td width=100% >  <b>相关评论:</b>    <input type=button name=xreview value=查看所有评论 onclick="javascript:window.open('index.asp?xAction=xReview&newid=22049','','');"></td></tr>
<tr><td width=100% ><hr size=1></td></tr>
<tr><td><table width=100% border=0 cellspacing=0 cellpadding=5 style="table-layout:fixed; word-break:break-all">
<tr bgcolor=E0D8AF><td width=50% >发表人:梦云阳光</td><td width=50% align=right></td></tr>
<tr><td>发表人邮件:<a href='mailto:xiongzhengyu@126.com'>xiongzhengyu@126.com</a></td><td align=right>发表时间:2005-12-19 20:11:00</td></tr>
<tr><td colspan=2>对爱的美好、完全的诠释。欣赏!</td></tr>
</table></td></tr>
<tr><td width=100% ><hr size=1></td></tr>
</table>
<table width=100% border=0 cellspacing=0 cellpadding=0  align=center>
<form method=post name=addreview action=index.asp?xaction=xaddreview>
<tr><td width=100% >  <B>发表评论:</b>    <input type=button name=xReview value=查看所有评论 onClick="javascript:window.open('index.asp?xAction=xReview&newid=22049','','');"></td></tr>
<tr><td width=100% ><hr size=1></td></tr>
<tr><td width=100% ><table border=0 cellspacing=0 width=100% cellpadding=4>
<input type=hidden name=NewsID value=22049><tr><td width=13% align=right><a name=send>用&nbsp;户&nbsp;名:</a></td><td width=87% ><input type=text name=Author size=40></td></tr>
<tr><td width=13% align=right>电子邮件:</td><td width=87% ><input type=text name=email size=40></td></tr>
<tr><td width=13% align=right valign=top>评论内容:</td><td width=87% ><textarea name=content cols=50 rows=8></textarea></td></tr>
<tr><td colspan=2 height=50 align=center><input name=passed type=hidden value=0>
(最多评论字数:500)<input type=submit value=发表评论 name=Submit><input name=reset type=reset value=重新填写></td></tr>
</table></td></tr></form></table>
</td></tr>
</table>
</td><td></td>
<td width="160" bgcolor="#faf6fd"></td>
</tr>
</table>
<table width=760 border=0 cellspacing=0 cellpadding=0
align=center>
<tr><td height=90 align=center width=380>
<iframe marginwidth=0 marginheight=0  frameborder=0 bordercolor='#000000' scrolling=no src='http://union.sogou.com/cpc/partner.php?pid=yzsz163&type=15' width=380 height=90></iframe></td>
<td height=90 align=center width=380>
<iframe marginwidth=0 marginheight=0  frameborder=0 bordercolor='#000000' scrolling=no src='
http://xz9.2000y.net/gg/yq_l_z.htm' width=380 height=90></iframe></td>
</tr>
</table>
<table width=760 border=0 cellspacing=0 cellpadding=0 align=center>
<tr><td height=90 align=center>
<iframe id=adframe marginwidth=0 marginheight=0 frameborder=0 scrolling=no src='http://pfp.sina.com.cn/union/17.html?id=13405&mode=0&size=350&qty=2&row=1&col=1&border=solid&btds=def784&btzs=

000000&btks=FEC100&gdzs=A83300&ggyds=FDF9E1&ggbks=FFAD10&ggds=FFFFFF&ggb

tzs=A83300&ggmszs=000000&sbox=1&kbox=1' width=350 height=90></iframe>
</td>
<td align=center>
<iframe marginwidth=0 marginheight=0 frameborder=0 scrolling=no src='http://xz9.2000y.net/gg/xz_l.htm' width=410 height=90></iframe>
</td>
</tr>
</table>

    <table width="778" border="0" cellspacing="0" cellpadding="0">
      <tr><td height="4" bgcolor="#dfc7f2"></td></tr>
    </table>
    <table width="778" border="0" cellspacing="0" cellpadding="0" align="center">
 <tr><td align="center" bgcolor="#faf6fd"><table width="100%" border="0" align="center" cellpadding="0" cellspacing="0">
  <tr><td><table width=750 border=0 cellspacing=0 cellpadding=0 align=center>
<tr><td><div align=center>
<br>
<p>
|&nbsp;<a href=http://www.xyzm.com>心缘之梦</a>&nbsp;|&nbsp;<a href="javascript:;" onclick="this.style.behavior='url(#default#homepage)';this.setHomePage('http://www.xyzm.com');">设为首页</a>&nbsp;|&nbsp;<a href="javascript:;" onclick=window.external.AddFavorite(location.href,document.title);>加入收藏</a>&nbsp;|&nbsp;<a href="mailto:lgz02166@yahoo.com.cn">联系我们</a>&nbsp;|&nbsp;<a href='index.asp?xAction=wzguanli' target='_blank'>进入管理</a>&nbsp;|<p>
联系人:<br><a href=http://www.miibeian.gov.cn target=_blank>备案号:陕ICP备05001781</a> 慈心QQ:342509660、383337176  网络律师 石勇QQ:34719653   <br><br>
</div></td></tr></table>
</td></tr>
</table></td></tr>
 <tr><td align="center" bgcolor="#faf6fd"></td></tr>
    </table>
</center>
</body>
</html>

 

    第三步,如何查找这篇文章的代码:

    上面是这个网页的整个HTML代码,但我们要找的是这篇文章自身的代码,那该怎么找呢,也不难,只要记住这样的几个标识符号和标记就行了。

    在记事本中,从上向下看,首先找到这篇文章的“爱的礼赞”发表日期,从发表日期向下隔一行,有两行缩进去的代码:

     <table width=100% border=0 cellspacing=0 cellpadding=0 align=center style="TABLE-LAYOUT: fixed">
    <tr><td style="WORD-WRAP: break-word"><br>

 

    就是该文章代码的开始。

    然后在向下寻找该文章代码的结束。方法:因为汉字好找,先找到下面的 “双击自动滚屏”向上数第五行只有一个“</table>” 代码,这就是该文的结束代码。

   找到后,采用复制的方法,从上向下将这篇文章的代码复制到编辑器中,既可大功告成。

   但有一点要注意:如果查看的文章加入了漂浮的特效,在复制代码时一定要将</table>下面的并排两行:

</td></tr></table>
</td></tr></table>

    一起复制,否则漂浮特效将不会显示。 一下面是这个文章的全部代码:

 

    <table width=100% border=0 cellspacing=0 cellpadding=0 align=center style="TABLE-LAYOUT: fixed">
    <tr><td style="WORD-WRAP: break-word"><br>
<TABLE id=table1 style="LEFT: -100px; WIDTH: 970px; POSITION: relative; TOP: 0px" borderColor=#cccccc cellSpacing=30 cellPadding=3 background=http://www.citychinese.com/bbs/UploadFile/2005-9/200592610191743919.jpg border=0>
<TBODY>
<TR>
<TD>
<TABLE borderColor=#cccccc cellSpacing=10 cellPadding=3 width="100%" background=http://sucai.heima.com/sucai/material/paper2002/paper01/0104/kabe/

kabe001/ba_a20.gif border=0>
<TBODY>
<TR>
<TD>
<TABLE borderColor=#cccccc cellSpacing=20 cellPadding=3 width="100%" background=http://www.citychinese.com/bbs/UploadFile/2005-9/200592610191743919.jpg border=0>
<TBODY>
<TR>
<TD>
<TABLE borderColor=#cccccc cellSpacing=30 cellPadding=3 width="100%" background=http://www.citychinese.com/bbs/UploadFile/2005-9/200592610185582295.jpg border=0>
<TBODY>
<TR>
<TD><BR>
<P align=center><FONT style="FONT-SIZE: 50pt; FILTER: shadow(color=#FFFF00); WIDTH: 439px; COLOR: #f90b46; LINE-HEIGHT: 150%; FONT-FAMILY: 隶书; HEIGHT: 88px" face=楷体_GB2312 color=#000000 size=5><B>爱 的 礼 赞</B></FONT></P><BR><BR><BR>
<P align=center><FONT face=楷体_GB2312 color=#daa520 size=5>文章/大梦觉醒&nbsp; 编辑/蝶儿<BR></FONT></B><BR><BR></P>
<P align=center>
<TABLE>
<TBODY>
<TR>
<TD width=400 background=http://images.quanjing.com/age_FS7/high/F58-199800.jpg height=250><EMBED pluginspage=http://www.macromedia.com/go/getflashplayer align=center src=http://imgfree.21cn.com/free/flash/4.swf width=400 height=250 type=application/x-shockwave-flash wmode="transparent" quality="high"></EMBED></TD></TR></TBODY></TABLE></P>
<P align=left><BR><FONT color=#deb887><FONT face=新宋体 size=5>&nbsp;&nbsp; 让爱供奉在我们灵魂的殿堂,就像美丽的花朵盛开在心灵的窗口,能幸福自己,亦能幸福许多人。&nbsp;爱是灵魂的内核,爱是人心的旗帜,爱是真善美的源泉,爱也是一种涂料,给这个世界涂抹着天堂的色彩。&nbsp;</FONT></FONT></P><FONT color=#deb887><FONT face=新宋体 size=5>
<P align=left><BR>&nbsp;&nbsp;&nbsp;&nbsp;在生命你中有我,我中有你的敬畏中,我深深地懂得了爱。幸福装在叫****的百宝箱里,只有爱才是生活的最高动机,才使我们短暂的生命转化为永恒的忘我境界,才使我们的存在具有实在的意义。</P>
<P align=left><BR>&nbsp;&nbsp;&nbsp;&nbsp;爱本质上是一种给予,而爱的幸福就在给予之中。爱的给予既不是奉献,亦不是施舍,它是一种内在的丰盈的情愫自然而然的流溢,是超越于道德和功利的。爱如同光源,爱者的幸福就在于普照万物;爱如同鲜花,爱者的幸福就在于散发出芬芳;爱如同甘泉,爱者的幸福就在于润泽大地。纪伯伦这样阐述爱:“爱除自身外无施与,除自身外无接受,爱不占有,也不被占有。因为爱在爱中满足了。”丰盈的爱使人像神一样博大。 <BR></FONT><BR></P></FONT></B><BR><BR>
<TABLE align=center>
<TBODY>
<TR>
<TD width=400 background=http://images.quanjing.com/130/high/2936.jpg height=250>
<DIV align=center><EMBED pluginspage=http://www.macromedia.com/go/getflashplayer align=center src=http://imgfree.21cn.com/free/flash/4.swf width=400 height=250 type=application/x-shockwave-flash quality="high" wmode="transparent"></DIV></EMBED></TD></TR></TBODY></TABLE>
<P>&nbsp;</P>
<P><BR><FONT face=新宋体 color=#deb887 size=5>&nbsp;&nbsp; 爱是最美丽的人性之光。爱营造的是友善、宽容、和平、和谐和温情的氛围;爱化解的是冷漠、隔阂、仇视、伤害和争斗。哪里有爱,哪里就有温暖,就有和谐。我企盼着每一颗心灵都充满爱,让爱凝聚成一轮光华四射的太阳,照耀着这个世界的每一个角落。</FONT></P>
<P><FONT face=新宋体 color=#deb887 size=5><BR>&nbsp;&nbsp;&nbsp;&nbsp;爱能让黄莲变得甘之如饴,苦酒酿成玉液琼浆。爱会让你爱现在和将来的每一个时刻,使你的意识中充满了美的感觉、美的享受。在爱中,你会发现,人世间所有的美好都降临到了你身上。</FONT></P>
<P><FONT face=新宋体 color=#deb887 size=5><BR>&nbsp;&nbsp;&nbsp;&nbsp;爱的唤醒是人类生命最最需要的馈赠。宇宙间存在的一切都是为了让人类学会爱。人类创造的一切文明,凝结的最珍贵的经验,最有价值的经验,那就是爱。&nbsp;</FONT></P>
<P><FONT face=新宋体 color=#deb887 size=5><BR>&nbsp;&nbsp;&nbsp;&nbsp;爱是人类灵魂神秘的力量,是人类独有的生命意识。爱穿越我们的肉身,飞升在人类精神的天空,无比高贵地蒸馏和清洁着我们俗常的生活,使我们的生命浓郁起来、跳跃起来、丰美起来。&nbsp;<BR><BR>&nbsp;&nbsp; <BR></P></FONT></B><BR><BR><EMBED src=http://att1.ccmove.com/ring/2/2005930_133029312582.mp3 width=400 height=40 hidden=true type=audio/x-pn-realaudio-plugin controls="controlpanel,statusbar" autostart="true" loop="true">
<TABLE align=center>
<TBODY>
<TR>
<TD width=400 background=http://images.quanjing.com/140/high/12500.jpg height=300>
<DIV align=center><EMBED pluginspage=http://www.macromedia.com/go/getflashplayer align=center src=http://imgfree.21cn.com/free/flash/4.swf width=400 height=300 type=application/x-shockwave-flash wmode="transparent" quality="high"></DIV></EMBED></TD></TR></TBODY></TABLE><BR><BR>
<DIV></DIV>
<P></P>
<DIV><FONT face=新宋体 color=#deb887 size=5></FONT></DIV>
<P><FONT face=新宋体 color=#deb887 size=5></FONT></P>
<DIV><FONT face=新宋体 color=#deb887 size=5></FONT></DIV>
<P><FONT face=新宋体 color=#deb887 size=5></FONT></P>
<P align=center><FONT face=新宋体 color=#deb887 size=5></FONT>&nbsp;</P><BR><BR>
<P align=center><BR><FONT face=新宋体 color=#deb887 size=5><IMG alt="" src="
http://www.xyzm.com/uploadpic/2005080421133683020.gif" onload="javascript:if(this.width>screen.width-333)this.width=screen.width-333" border=0>&nbsp;</FONT></P></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE>

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

</TBODY></TABLE>    <br></td></tr></table>
</td></tr>
<tr><td width=100% bordercolor=#FFFFFF><hr size=1></td></tr>
<tr><td height=3 bordercolor=#FFFFFF></td></tr>
</table>
</td></tr></table>
</td></tr></table>

    第四步、将这篇文章的代码复制到“html编辑器”中或者网站上的发布文章对话框内,就可以看到效果了。

    具体使用方法:

    1、在线编辑器

    恒上快网--在线htm编辑器

http://www.hengss.com/shiyong/6.html

    步行街html编辑器 http://www.bxjie.net/bbs/wy/html.htm

   这两个编辑器是一样的。打开编辑器,点击下面的“HTML”,删除里面出现的代码,再将这篇文章的代码复制进去,然后点击上面的蓝色“运行html",效果便会出现了。

   

    进入“发布新文章”,“文章内容”对话框上方的工具栏内有一个“ 查看HTML源代码”工具,先在其前面的小方格内打上勾,将该文章的代码复制进去,然后取消勾,也可以看到该文的效果。就这样简单,你会了吗?

    当你拿到了这篇文章的代码,又看到了整篇文章的效果,这个时候你就可以借用它山之石,来装饰自己的文章了。

    通过这一课的学习,对HTML语言有个接触,对在HTML编辑状态下的表格制作有个整体上的了解,为下一步学习打下一个基础。

 

双击自动滚屏 【打印本页】 【关闭窗口
 相关评论:



yuhongye2324
(2006/8/28 17:44:00)

会用简单的就会看懂复杂的了......

 发表评论:共有 1 条评论

身份选择:会员 游客(游客不需要输入密码)
用 户 名: 密 码:
评论内容:
(最多评论字数:500)

山里人网站 | 设为首页 | 加入收藏 | 联系我们 | 进入管理 | 关于站长 | 本站搜索

联系电话:QQ:313538590 752398505 联系人:山里人