|
歡迎您！啟步學代碼
（原創(chuàng)制作者:游子。供初學HTML代碼的朋友參考）
如何在圖框內(nèi)插入圖片或文字。
學習和掌握了HTML代碼兩大基本功即文字設置和表格設置
之后，就可以制作一些多姿多彩的代碼貼了。
我們可以在一張用圖片或顏色作背景的表格單元格內(nèi)
（單層或多層圖框內(nèi)），插入多段文字的和圖片．
根據(jù)插入的圖片寬度和色彩選好圖框。有些論壇對代碼
貼圖的寬度限制在５００之內(nèi)，所以圖框包括邊線寬度不能
超過５００，插入的圖片寬度在４００以內(nèi)，否則其超過部
份就無法顯示。如果論壇對代碼貼寬度不限制,插入的圖片就
可寬限些．由于插入的圖片加圖框的寬很大，所以必須設置
全屏代碼，才能完整顯示。網(wǎng)絡上有很多漂亮的圖框（套裝）
，可以拿來套用。啟步學習時，最好采用較簡單的圖框。
在一張圖框或圖片內(nèi)如何插入文字和圖片？
要在表格的單元格<TD>與</TD>中間插入。例如：
<TABLE width=480 height=350 bordercolor=olive background=http://image49.360doc.com/DownloadImg/2012/02/2215/21722927_15.gif border=18>
<TR>
<TD >
<FONT style="FONT-SIZE: 25pt" face=華文行楷 color=#0000ff><B><p align=CENTER>插入文字或圖片</P>
<p align=CENTER>插入文字或圖片</P>
<p align=CENTER>插入文字或圖片</P>
</B> </FONT>
</TD></TR></TABLE></CENTER>
說明：
●width=480＝圖框?qū)挾龋?BR> ●height=350＝圖框高度；
●bordercolor=oliv＝邊框顏色；
●border=8＝邊框線粗度．
●background=背景圖片地址．
| |
顯示結(jié)果：
代碼實例：
<TABLE width=480 height=350 bordercolor=olive background=http://image49.360doc.com/DownloadImg/2012/02/2215/21722927_15.gif border=18>
<TABLE width=480 height=350 bordercolor=olive background=http://image49.360doc.com/DownloadImg/2012/02/2215/21722927_15.gif border=18>
<TR>
<TD >
<FONT style="FONT-SIZE: 25pt" face=華文行楷 color=#0000ff><B>
<br> <p align=CENTER>萬紫千紅總是春</P>
<p align=CENTER><img src="http://image49.360doc.com/DownloadImg/2012/02/2215/21722927_7.jpg"width=400 border=1>
</P>
<p align=CENTER><img src="http://image49.360doc.com/DownloadImg/2012/02/2215/21722927_8.jpg"width=400 border=1>
</P>
<p align=CENTER><img src="http://image49.360doc.com/DownloadImg/2012/02/2215/21722927_9.jpg"width=400 border=1>
</P>
<p align=CENTER>圖文：網(wǎng)絡／編輯：游子</P>
</B> </FONT>
</TD></TR>;</TABLE></CENTER>
| |
 顯示結(jié)果：
萬紫千紅總是春
圖文：網(wǎng)絡／編輯：游子 |
把上面窄幅代碼貼的圖框和圖片寬度各加大200,代碼如下:
<TABLE width=680 height=350 bordercolor=olive background=http://image49.360doc.com/DownloadImg/2012/02/2215/21722927_15.gif border=18>
<TR>
<TD >
<FONT style="FONT-SIZE: 25pt" face=華文行楷 color=#0000ff><B>
<br> <p align=CENTER>萬紫千紅總是春</P>
<p align=CENTER><img src="http://image49.360doc.com/DownloadImg/2012/02/2215/21722927_7.jpg"width=600 border=1>
</P>
<p align=CENTER><img src="http://image49.360doc.com/DownloadImg/2012/02/2215/21722927_8.jpg"width=600 border=1>
</P>
<p align=CENTER><img src="http://image49.360doc.com/DownloadImg/2012/02/2215/21722927_9.jpg"width=600 border=1>
</P>
<p align=CENTER>圖文：網(wǎng)絡／編輯：游子</P>
</B> </FONT>
</TD></TR></TABLE></CENTER>
| |
顯示結(jié)果：
萬紫千紅總是春
圖文：網(wǎng)絡／編輯：游子 |
像這樣的寬幅代碼貼,就必須加設全屏代碼:
在代碼的第一行前面加以下代碼：
<DIV id=table1 style="LEFT: -220px; WIDTH:
800px;POSITION: relative; TOP: 40px">
在代碼最后一行加以下代碼：
</DIV><br><br><br><br>
不設置全屏代碼時，貼子右邊有一部份不能顯示。
（待續(xù)）
編輯：游子
（為了讓更多網(wǎng)友學用html代碼貼圖制作網(wǎng)頁，本貼歡迎轉(zhuǎn)載，但是，轉(zhuǎn)載時請不要把原創(chuàng)編輯游子的名字改掉。謝謝?。?/FONT> | 
