国产一级a片免费看高清,亚洲熟女中文字幕在线视频,黄三级高清在线播放,免费黄色视频在线看

打開APP
userphoto
未登錄

開通VIP,暢享免費(fèi)電子書等14項(xiàng)超值服

開通VIP
教您制作表格嵌套

教您制作表格嵌套

邊框制作 2010-01-17 23:59:12 閱讀81 評論0   字號: 訂閱

 

引用藍(lán)天教您制作表格嵌套

 

    表格的嵌套一方面是為使頁面(貼子)的外觀更為漂亮,利用表格嵌套來編輯出復(fù)雜而精美的效果,另一方面是出于布局需要,用一些嵌套方式的表格來做精確的編排,或者二者兼而有之。熟練地掌握表格的嵌套技巧并不是很困難的,只要你思路清晰,對表格的整體嵌套構(gòu)架做到心中有數(shù),在實(shí)際編輯時(shí)就不會出亂,發(fā)布出來的作品也就不會只是一堆代碼。

博客教材將從最簡單的表格嵌套開始演示和講解,不會太難的。

兩張表格的嵌套:

【博客教材】歡迎您的光臨

【博客教材】歡迎您的光臨
【博客教材】歡迎您的光臨
代碼如下(綠色的為第二張表格的代碼):

<table border=8 bordercolor=#0099cc width=100%>
<tbody>
<tr>
<td>【博客教材】歡迎您的光臨
<table border=8 bordercolor=#ccffcc width=100%>
<tbody>
<tr>
<td><br>【博客教材】歡迎您的光臨
<br></td>
</tr>
</tbody>
</table>
博客教材】歡迎您的光臨
</td>
</tr>
</tbody>
</table>


從上面的代碼中,我們看得出來,第二張表格代碼包含在第一張表格代碼中的<td>和</td>里面,這一點(diǎn)一定要弄清楚。不然,終止符不正確或缺少時(shí),由于系統(tǒng)的容錯(cuò)性不好、自動修正功能不夠智能化等問題,效果將會很糟糕,錯(cuò)誤太嚴(yán)重的話還會使瀏覽器在運(yùn)算的時(shí)候進(jìn)入死循環(huán)而造成機(jī)器當(dāng)機(jī)。

下面是三個(gè)表格的嵌套代碼及效果,由于表格里沒有內(nèi)容,所以,博客教材指定了三級表格的高度。代碼中,每一個(gè)表格的代碼用一種顏色來區(qū)分。

 

 


代碼:

<TABLE borderColor=#6633ff width="100%" border=8>
<TBODY>

 

<TR>
<TD>
<TABLE borderColor=#cc9966 width="100%" border=8>
<TBODY>
<TR>
<TD>
<TABLE borderColor=#003300 height=200 width="100%" border=8>
<TBODY>
<TR>
<TD></TD>
</TR>
</TBODY>
</TABLE>
</TD>
</TR>
</TBODY>
</table>
</td>
</tr>
</tbody>
</Table>

一般來說,只要結(jié)構(gòu)清晰,再多的表格嵌套也是一樣操作的。博客教材再次提示:不管是多少張表格嵌套,一定要注意起始標(biāo)識符的正確性,稍有點(diǎn)錯(cuò)誤,系統(tǒng)會自動幫你更正,但更正的效果或許不是你所需的,而且,一旦錯(cuò)誤太多,系統(tǒng)的自動更正也無能為力

 

 

表格的嵌套(二)

先來看看以下表格:

 

 

 


你應(yīng)該可以看得出來,上表中有一個(gè)一級表格(父表格),里面有兩個(gè)二級表格(子表格),二級表格一上一下,位置十分清楚。如果你愿意,你還可以在二級表格里再嵌套次級別的表格。

現(xiàn)在我們來看代碼,每一種顏色的文字代碼一個(gè)表格的完整代碼,注意觀察起始標(biāo)識符號的前后關(guān)系。

<table border=6 bordercolor=#888888 width="100%">

 

 

 

 

 

<tbody><tr><td>
<table border=5 bordercolor=#ffcc00 width="100%" height=200>
<tbody><tr><td></td></tr></tbody>
</table>

<table border=5 bordercolor=#ffcc00 width="100%" height=200>
<tbody><tr><td></td></tr></tbody>

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


這種方式的嵌套可以讓你有更多的創(chuàng)意,比如,上面的二級表格里放置一個(gè)背景圖并用透明Flash動畫來修飾它,下面一個(gè)表格里放置滾動圖文,總之,發(fā)揮你的想象力,充分利用這種格式制作出令人贊嘆的效果來!

 

表格的嵌套(三)

 

 


與上一講的嵌套效果相比,我們可以明顯地看到:上面表格中的兩個(gè)二級表格是并列放在父表里的。如何做到這個(gè)效果呢?

首先,在父表格里,我們用兩次“<td>……</td>”將父表分隔成左右各一半,即父表是一個(gè)有一行兩列的表格。其次,我們在父表的左、右單元格里分別放置一個(gè)表格,就形成了以上效果。請研究以下代碼清單,為了區(qū)分層次,博客教材把每一個(gè)表格的代碼用一種顏色表示,請?zhí)貏e注意父表的代碼:

<TABLE borderColor=#ccffcc width="100%" border=4>
<TBODY>
<TR>
<TD width="50%">
<TABLE borderColor=#666666 height=300 width="100%" border=4>
<TBODY><TR><TD></TD></TR></TBODY>
</TABLE>
</TD>
<TD width="50%">
<TABLE borderColor=#666666 height=300 width="100%" border=4>
<TBODY><TR><TD></TD></TR></TBODY>
</TABLE>
</TD>
</TR></TBODY>
</TABLE>

上述代碼里,博客教材定義了二級表格的高度,在實(shí)際使用中,你可以根據(jù)情況定義或不定義,但要注意兩個(gè)子表格的高度要一致,否則就很難看。此外,表格的border值要不要應(yīng)該根據(jù)實(shí)際需要而定,博客教材之所以定義為4,是為了使效果更加明顯。

表格是HTML文檔里的元素之一,它還可以是容器,因此,表格里甚至是表格的單元格里又有表格是正常的,我們就是充分利用這一特點(diǎn)來裝飾我們的文檔(或貼子)。

第五講的三個(gè)講義專門研究了表格嵌套,嵌套原理到嵌套格式及嵌套方法我們都應(yīng)該學(xué)會了。講義里的例子是簡單的,但它們已經(jīng)將表格的嵌套結(jié)構(gòu)展示完畢,在這個(gè)基礎(chǔ)上,我們可以制作出復(fù)雜而美觀的貼子來。所有多層次嵌套及嵌套中的嵌套都是通過一個(gè)又一個(gè)簡單的嵌套來實(shí)現(xiàn)的,這就看你的了 !

本站僅提供存儲服務(wù),所有內(nèi)容均由用戶發(fā)布,如發(fā)現(xiàn)有害或侵權(quán)內(nèi)容,請點(diǎn)擊舉報(bào)
打開APP,閱讀全文并永久保存 查看更多類似文章
猜你喜歡
類似文章
表格的制作(送給音畫愛好者)
邊框套表格范例代碼1
主頁各類模塊代碼大全(本博客原創(chuàng)整理,歡迎引用)
代碼入門教程(20)
設(shè)計(jì)邊框的代碼
Html表格制作及實(shí)例
更多類似文章 >>
生活服務(wù)
分享 收藏 導(dǎo)長圖 關(guān)注 下載文章
綁定賬號成功
后續(xù)可登錄賬號暢享VIP特權(quán)!
如果VIP功能使用有故障,
可點(diǎn)擊這里聯(lián)系客服!

聯(lián)系客服