HTML初級教程（一）所有的代碼和操作方法 - Qzone日誌

[轉] HTML初級教程（一）所有的代碼和操作方法 [圖片] 精美的花邊邊框製作   教程原創： 墨梅冷閣   指導老師: 心心知我心   製作:青青草因為有很多朋友想學花邊邊框製作，但是又沒有足夠的時間來群裡面學習，為了讓更多的朋友學會花邊邊框製作，我今天把所有的程序和原圖代碼寫在 HTML初級教程（一）（二）（三）裡面，這樣就方便所有愛好空間的朋友學習製作！HTML的製作程序是；1）點寫日誌；2）點右邊高級：3）點HTML：4）去掉HTML裡面以前的代碼；5）粘貼原代碼：6）（這裡放入圖素材地址）：意思就是放一張花邊邊框的圖地址在那裡。初級教程課一·大圖背景：原始代碼：   <TABLE style="BACKGROUND-IMAGE: url (這裡放入圖素材地址)"  borderColor=#cccccc cellSpacing=60 cellP adding=60 align=center bgColor =#ffffff border=0><TBODY><TR><TD><P align=center><FONT face=楷體_GB2312><FONT  size=5><STRONG></STRONG></FONT></FONT> &nbsp;</P></TD></TR></TBODY> </TABLE></TD></TR> </TABLE>下面是大圖背景預覽圖選你自己喜歡的圖地址一般是寫日誌正文的。這裡寫日誌初級教程課二·大圖背景成框：原始代碼：（三層）<TABLE style="BACKGROUND-IMAGE:url(這裡放圖地址一)" borderColor=#cccccccellSpacing=34 cellPadding=34 align=center bgColor=#ffffff border=0><TBODY><TR><TD><TABLE style="BACKGROUND-IMAGE:url(這裡放圖地址二)" borderColor=#cccccccellSpacing=3 cellPadding=3 align=center bgColor=#ffffff border=0><TBODY><TR><TD><TABLE style="BACKGROUND-IMAGE: url(這裡放圖地址三)" borderColor=#cccccccellSpacing=40 cellPadding=40 align=center bgColor=#ffffff border=0><TBODY><TR><TD><P align=center>&nbsp;</P></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE></CENTER>

初級教程課三·音樂貼圖動畫：這個請參照：HTML初級教程（三）（音樂貼）的操作方法：原始代碼：<TABLE cellSpacing=2 cellPadding=2 width_=480align=center bgColor=#000000border=0><TBODY><TR><TD><P>&nbsp;</P><MARQUEE><IMG style="BACKGROUND: nonetransparent scroll repeat 0% 0%;WIDTH: 500px;HEIGHT:313px" height=48 src="這裡放圖地址" width_=48fakesize="1"> 　<IMG style="BACKGROUND: none transparent scroll repeat 0% 0%;WIDTH: 500px; HEIGHT: 313px"height=48 src="這裡放圖地址" width_=48 fakesize="1"> <IMG style="BACKGROUND: none transparent scrollrepeat 0% 0%; WIDTH: 500px; HEIGHT: 313px"height=48 src="這裡放圖地址"width_=48 fakesize="1"><IMG style="BACKGROUND: none transparent scrollrepeat 0% 0%; WIDTH: 500px; HEIGHT:313px" height=48src="這裡放圖地址" width_=48 fakesize="1"><IMG style="BACKGROUND: nonetransparent scroll repeat 0% 0%; WIDTH:500px; HEIGHT: 313px" height=48 src="這裡放圖地址"width_=48 fakesize="1" bloaded="true"loadingtimer="-1"> 　<IMG style="BACKGROUND:none transparent scroll repeat 0% 0%;WIDTH: 500px; HEIGHT:313px" height=48 src="這裡放圖地址"width_=48 fakesize="1"bloaded="true" loadingtimer="-1"><IMG style="BACKGROUND: nonetransparent scroll repeat 0% 0%; WIDTH:500px; HEIGHT: 313px"height=48 src="這裡放圖地址" width_=48 fakesize="1" bloaded="true" loadingtimer="-1"><IMG style="BACKGROUND: none transparent scroll repeat 0% 0%; WIDTH: 500px;HEIGHT: 313px"height=48src="這裡放圖地址" width_=48 fakesize="1"bloaded="true" loadingtimer="-1"></MARQUEE></TD></TR></TBODY></TABLE></DIV>初級教程課四·精美邊框：原代碼（7層）<P></P><CENTER><TABLE style="BACKGROUND-IMAGE: url(圖地址)" borderColor=#cccccc cellSpacing=34 cellPadding=34 align=center bgColor=#ffffff border=0><TBODY><TR><TD><TABLE style="BACKGROUND-IMAGE: url(圖地址)"borderColor=#cccccc cellSpacing=3cellPadding=3 align=center bgColor=#ffffff border=0><TBODY><TR><TD><TABLE style="BACKGROUND-IMAGE: url(圖地址)"borderColor=#cccccc cellSpacing=40 cellPadding=40 width_="100%" align=center bgColor=#ffffffborder=0><TBODY><TR><TD><TABLE style="BACKGROUND-IMAGE: url(圖地址)"borderColor=#cccccc cellSpacing=3cellPadding=3 align=center bgColor=#ffffff border=0><TBODY><TR><TD><TABLE style="BACKGROUND-IMAGE: url(圖地址);WIDTH: 710px; HEIGHT: 429px" borderColor=#cccccccellSpacing=34 cellPadding=34 width_=858 align=centerbgColor=#ffffff border=0><TBODY><TR><TD><TABLE style="BACKGROUND-IMAGE: url(圖地址)"borderColor=#cccccc cellSpacing=3 cellPadding=3 align=center bgColor=#ffffff border=0><TBODY><TR><TD><TABLE style="BACKGROUND-IMAGE: url(圖地址)"borderColor=#cccccc cellSpacing=40cellPadding=40 align=center bgColor=#ffffff border=0><TBODY><TR><TD><CENTER><P align=center><FONT color=#000000><FONT size=5>這裡寫內容！</FONT></P></CENTER></FONT></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE><P></P></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE><CENTER></CENTER><P></P><CENTER>&nbsp;</CENTER></TD></TR></TBODY></TABLE></CENTER>這個只要HTML操作程序 會了就直接可以在HTML編輯框內編輯   我現在告訴大家，怎樣提取圖片的網址：這大家都知道現在學花邊邊框都需要圖片的地址，有這些地址才可以做出漂亮的花邊邊框。1)，在發表評論欄裡面提取地址:首先你要找到你需要的圖片，你們點一下圖片，會跳出你需要的圖片在電腦的正面，圖片的上面有地址欄，地址欄裡面就是這一張圖片的地址了，你們複製以後，粘貼到你們需要的地方就好了。這個和提取動畫地址是一樣的。2），在相冊裡面提取網址：其實在相冊裡面提取網址是最好的方法，因為這些有可能經常使用，但是必須上傳到相冊，首先找到你需要上傳的圖片，把滑鼠放在圖片的上面，點擊滑鼠的右鍵，上面有（圖片另存為S）你們點一下，文件名（N )你最好自己填，1.2.3啊！或者是什麼內型的你就寫什麼，這樣就便於自己找到。然後再上傳相冊，在相冊裡面你找到你需要的圖片，用左鍵點擊這張圖片，你們看見這個圖片出來以後，圖片的右上角有複製地址，你們點一下，記住一定要複製原圖地址哦，這樣就可以把地址粘貼到你需要的地方了。另外圖片上傳相冊，就可以製作動畫影集了。  五層花邊邊框源代碼</SPAN></FONT></STRONG><P></P><P class=MsoNormal style="MARGIN: 0cm 0cm 0pt; TEXT-INDENT: 21.75pt" align=center>&nbsp;</P><P align=center><TABLE style="BACKGROUND-IMAGE: url(圖地址)" borderColor=#cccccc cellSpacing=80 cellPadding=80 align=center bgColor=#ffffff border=1><TBODY><TR><TD><TABLE style="BACKGROUND-IMAGE: url(圖地址)" borderColor=#cccccc cellSpacing=12 cellPadding=12 align=center bgColor=#ffffff border=1><TBODY><TR><TD><TABLE style="BACKGROUND-IMAGE: url(圖地址)" borderColor=#cccccc cellSpacing=8 cellPadding=8 align=center bgColor=#ffffff border=1><TBODY><TR><TD><TABLE style="BACKGROUND-IMAGE: url(圖地址)" borderColor=#cccccc cellSpacing=6 cellPadding=6 align=center bgColor=#ffffff border=1><TBODY><TR><TD><TABLE style="BACKGROUND-IMAGE: url(圖地址)" borderColor=#cccccc cellSpacing=5 cellPadding=5 align=center bgColor=#ffffff border=1><TBODY><TR><TD><P>&nbsp;</P></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE>&nbsp;</TD></TR></TBODY></TABLE></P><P align=center><FONT color=#66ff00 size=6><STRONG></STRONG></FONT>6層的花邊邊框代碼<DIV class=real_blog style="TEXT-INDENT: 0em; HEIGHT: auto! important"><TABLE style="; WIDTH: 100%; POSITION: relative" cellSpacing=0 cellPadding=0><TBODY><TR><TD style="WORD-WRAP: break-word" vAlign=top><P>&nbsp;</P><DIV style="FONT-SIZE: 16px"><P align=center>&nbsp;</P><P><TABLE style="BACKGROUND-IMAGE: url(#)" borderColor=#cccccc cellSpacing=10 cellPadding=10 align=center bgColor=#ffffff border=0><TBODY><TR><TD><TABLE style="BACKGROUND-IMAGE: url(#)" borderColor=#cccccc cellSpacing=90 align=center bgColor=#ffffff border=0><TBODY><TR><TD>&nbsp;<TABLE style="BACKGROUND-IMAGE: url(#)" borderColor=#cccccc cellSpacing=10 cellPadding=10 align=center bgColor=#ffffff border=1><TBODY><TR><TD><TABLE style="BACKGROUND-IMAGE: url(#)" borderColor=#cccccc cellSpacing=40 cellPadding=40 align=center bgColor=#ffffff border=0><TBODY><TR><TD><TABLE style="BACKGROUND-IMAGE: url(#)" borderColor=#cccccc cellSpacing=10 cellPadding=10 align=center bgColor=#ffffff border=0><TBODY><TR><TD><TABLE style="BACKGROUND-IMAGE: url(#)" borderColor=#cccccc cellSpacing=38 cellPadding=38 align=center bgColor=#ffffff border=0><TBODY><TR><TD><P>&nbsp;</P></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE></P></DIV></TD></TR></TBODY></TABLE></DIV><DIV class=real_blog style="TEXT-INDENT: 0em; HEIGHT: auto! important"><TABLE style="; WIDTH: 100%; POSITION: relative" cellSpacing=0 cellPadding=0><TBODY><TR><TD style="WORD-WRAP: break-word" vAlign=top><P>&nbsp;</P></TD></TR></TBODY></TABLE></DIV>六層花邊邊框 源代碼<DIV class=real_blog style="TEXT-INDENT: 0em; HEIGHT: auto! important"><TABLE style="; WIDTH: 100%; POSITION: relative" cellSpacing=0 cellPadding=0><TBODY><TR><TD style="WORD-WRAP: break-word" vAlign=top><P>&nbsp;</P><DIV style="FONT-SIZE: 16px"><P align=center>&nbsp;</P><P><TABLE style="BACKGROUND-IMAGE: url(#)" borderColor=#cccccc cellSpacing=10 cellPadding=10 align=center bgColor=#ffffff border=0><TBODY><TR><TD><TABLE style="BACKGROUND-IMAGE: url(#)" borderColor=#cccccc cellSpacing=90 align=center bgColor=#ffffff border=0><TBODY><TR><TD>&nbsp;<TABLE style="BACKGROUND-IMAGE: url(#)" borderColor=#cccccc cellSpacing=10 cellPadding=10 align=center bgColor=#ffffff border=1><TBODY><TR><TD><TABLE style="BACKGROUND-IMAGE: url(#)" borderColor=#cccccc cellSpacing=40 cellPadding=40 align=center bgColor=#ffffff border=0><TBODY><TR><TD><TABLE style="BACKGROUND-IMAGE: url(#)" borderColor=#cccccc cellSpacing=10 cellPadding=10 align=center bgColor=#ffffff border=0><TBODY><TR><TD><TABLE style="BACKGROUND-IMAGE: url(#)" borderColor=#cccccc cellSpacing=38 cellPadding=38 align=center bgColor=#ffffff border=0><TBODY><TR><TD><P>&nbsp;</P></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE></P></DIV></TD></TR></TBODY></TABLE></DIV><DIV class=real_blog style="TEXT-INDENT: 0em; HEIGHT: auto! important"><TABLE style="; WIDTH: 100%; POSITION: relative" cellSpacing=0 cellPadding=0><TBODY><TR><TD style="WORD-WRAP: break-word" vAlign=top><P>&nbsp;</P></TD></TR></TBODY></TABLE></DIV>
推薦閱讀：