动漫美女全彩禁处受辱视频,韩国美女一级毛片免费视频

前言

追求完美的你，不可能只留戀于像編輯Word文檔一樣編輯你的帖子，也不會(huì)滿(mǎn)足于使用有限的UBB語(yǔ)法來(lái)制作你的帖子，“盜用”別人的代碼也不是長(zhǎng)久之計(jì)?？吹絼e人那些精美無(wú)比的HTML帖子，你早已躍躍欲試了！

如果是這樣，那么，本教程就是為你準(zhǔn)備的！

本教程主要適合于HTML論壇新手和初中級(jí)水平的水手參考使用，對(duì)于擁有Web管理網(wǎng)站的朋友，本教程也很有指導(dǎo)意義。而對(duì)于想學(xué)習(xí)HTML的朋友，這也是一個(gè)不錯(cuò)的教程?？傊隈R盡量使用最通俗易懂的方式介紹HTML帖子的相關(guān)語(yǔ)法和制作方法、技巧。

或許你已經(jīng)是HTML帖子的制作高手了，那么，如果你有耐心一章一節(jié)地看下去，說(shuō)不準(zhǔn)也對(duì)你有所幫助——里面的內(nèi)容，極可能有些是你未接觸過(guò)或者不太熟悉的；如果你是教授級(jí)別的，那么，瀏覽一下也無(wú)妨，你可以給黑馬提提意見(jiàn)，讓本教程對(duì)大家的幫助達(dá)到最佳效果。

讓我們首先從字體設(shè)置開(kāi)始。

在HTML代碼里，字體的定義并不是很難，我們只需用<font>標(biāo)簽即可定義字體、字號(hào)、字體顏色等。<font> 標(biāo)簽原則上要求成對(duì)出現(xiàn)，即在被修飾的字體前使用<font>引導(dǎo)，在被修飾的文字后用</font>結(jié)尾。下面給出例子和效果及相關(guān)說(shuō)明：

語(yǔ)法：<font face=黑體 size=4 color=red>黑馬在線(xiàn)動(dòng)力</font>

效果：黑馬在線(xiàn)動(dòng)力

說(shuō)明：<font>標(biāo)簽里，face為字體名稱(chēng)，“=黑體”即表示被修飾的文字即“黑馬在線(xiàn)動(dòng)力”的字體為黑體，至于定義為什么字體，看你的喜好了，如果你所設(shè)置的字體不存在，系統(tǒng)自動(dòng)使用默認(rèn)字體顯示（如中文Windows平臺(tái)下宋體就是默認(rèn)字體）；size表示字號(hào)，論壇里可用字號(hào)是1號(hào)到7號(hào)，通常數(shù)字越大字號(hào)也就越大（也有的論壇相反），如果用戶(hù)定義的字號(hào)超過(guò)7號(hào)則以7號(hào)顯示（但還有其他方法突破7號(hào)字體，稍后我們會(huì)討論到的）；color用來(lái)定義文字的顯示顏色，其值放在和前面的各元素一樣放在等號(hào)的后面，顏色的表示方式可用少量的顏色英文明文，也可用Web色碼方式，如#ff0000，色碼表請(qǐng)參閱黑馬在線(xiàn)動(dòng)力提供的色碼表。

size還有一種賦值方法，形式如下：

這類(lèi)表達(dá)式適用于未使用CSS設(shè)定的頁(yè)面，它表示被修飾的文字在默認(rèn)字號(hào)基礎(chǔ)上加大一號(hào)。

字體修飾還用到其他的標(biāo)簽，分別介紹如下：

粗體：<b>文字</b> （例：文字）

加重：<strong>文字</strong> (例：文字）

上標(biāo)：<sup>文字</sup> （例：文字）

下標(biāo)：<sub>文字</sub> （例：文字）

斜體：<i>文字</i> （例：文字）

下劃線(xiàn)：<u>文字</u> （例：文字）

提示：連同<font>標(biāo)簽一塊，以上這些修飾方法，只要不相互沖突就可以結(jié)合起來(lái)使用。

標(biāo)題修飾：<hx>文字</hx>。其中，x為1到6的數(shù)字。以下是h1到h6的標(biāo)題式樣效果，我們可以看到，字號(hào)是逐漸變小的：

標(biāo)題一

標(biāo)題二

標(biāo)題三

標(biāo)題四

標(biāo)題五

標(biāo)題六

最后講講突破7號(hào)字大小問(wèn)題：

我們需要以嵌套方式調(diào)用CSS樣式來(lái)定義字體，這種方法可以讓我們最大限度地設(shè)置字號(hào)大小，實(shí)現(xiàn)方法也很簡(jiǎn)單，只需在<font>標(biāo)簽里用以下代碼替換純HTML原來(lái)的元素即可。請(qǐng)看以下代碼和效果：

代碼：<font color=#ff0000 style="font-size: 100pt;font-family:華文行楷,隸書(shū),黑體">春天</font>

效果：

春天

CSS擴(kuò)展了HTML功能，它能夠令帖子和網(wǎng)頁(yè)的可控制程度更高。更多的CSS知識(shí)我們將在后面陸續(xù)介紹，你也可以閱讀這個(gè)了解和學(xué)習(xí)一下CSS濾鏡修飾字體的強(qiáng)大功能。

分隔符標(biāo)簽詳解

從代碼結(jié)構(gòu)來(lái)看，HTML帖子實(shí)際上就是一個(gè)去頭去尾的Web頁(yè)面，原帖和回復(fù)置于<body>和</body>之間，我們可以把原帖和回復(fù)帖分開(kāi)來(lái)看，這樣，每一個(gè)帖子實(shí)際上就相當(dāng)于Web頁(yè)面的正文了。正文的行與行之間、段與段之間甚至上一個(gè)顯示元素和下一個(gè)顯示元素之間，如若我們不刻意去把它們分隔開(kāi)來(lái)，情形會(huì)怎么樣呢？顯然會(huì)是一團(tuán)糟，你的帖子將是一個(gè)大團(tuán)塊，閱讀起來(lái)將十分不便。

為此，學(xué)習(xí)和掌握HTML語(yǔ)法中的分隔標(biāo)簽非常有必要，嫻熟地應(yīng)用分隔標(biāo)簽，將能令你制作的帖子可讀性強(qiáng)、外觀(guān)整潔漂亮。

強(qiáng)行換行：<br>

在需要處打上<br>標(biāo)簽，<br>后面的內(nèi)容將強(qiáng)行換到下一行。Web頁(yè)會(huì)根據(jù)自己的可顯示寬度自動(dòng)換行（除非定義為不換行，不換行標(biāo)簽是<nobr>），但有些情況下，我們需要強(qiáng)行換行（比如詩(shī)歌、歌詞等的編排），此時(shí)<br>標(biāo)簽就能派上用場(chǎng)。<br>可以連續(xù)使用，如果<br>后面沒(méi)有內(nèi)容，它將表示一個(gè)空行。<br>是獨(dú)立使用的標(biāo)簽，沒(méi)有終止符，</br>是錯(cuò)誤的！

強(qiáng)行分段：<p>內(nèi)容</p>

與換行不同，p用來(lái)強(qiáng)行分段，它是成對(duì)出現(xiàn)的標(biāo)簽，即以起始符<p>引導(dǎo)被修飾的段落，以</p>結(jié)束該段。在HTML頁(yè)面里，段與段之間的距離相當(dāng)于一個(gè)空行，并不像Word里用回車(chē)分段得出的效果那樣。默認(rèn)情況下用兩個(gè)<br>也得到分段的效果，但這樣可能會(huì)存在一些問(wèn)題：一是，假設(shè)預(yù)定義了行高，那么，兩個(gè)<br>造成的兩個(gè)段落的上下間距可能與用p的不同；二是，像動(dòng)網(wǎng)論壇那樣，用<br>來(lái)給一系列超級(jí)鏈接分行，不管連續(xù)用多少個(gè)<br>，<br>都極可能被吞掉，結(jié)果是，那些超級(jí)鏈接外觀(guān)上將是連在一起的，分辯起來(lái)哪是哪比較困難，所以建議用p標(biāo)簽來(lái)給它們分段（當(dāng)然還有其他的手段）。

類(lèi)似p標(biāo)簽的還有div，記作：<div>內(nèi)容</div>。嚴(yán)格來(lái)說(shuō)div不是一個(gè)分段標(biāo)簽，它和span等元素一樣，屬于網(wǎng)頁(yè)布局元素，用于網(wǎng)頁(yè)制作的布局、定位、色塊等設(shè)計(jì)，但在論壇里，div的作用非常類(lèi)似于p，不過(guò)，它分出的段落間距不一定與標(biāo)簽p一致。

分隔線(xiàn)：<hr>

分隔線(xiàn)標(biāo)簽<hr>也是獨(dú)立使用的，它將令Web頁(yè)出現(xiàn)一條線(xiàn)條。如果不需要特別的裝飾，直接用<hr>即可，也可以修飾分隔條，讓它和你的帖子更協(xié)調(diào)地配合起來(lái)。<hr>標(biāo)簽可定義元素主要有：

size — 厚度，即分隔線(xiàn)的粗細(xì)，默認(rèn)為1；

color — 顏色，記作：color=顏色值；

width — 寬度，可用實(shí)數(shù)值表示，也可用百分比；

align — 對(duì)齊方式。居中：center，左對(duì)齊：left，右對(duì)齊：right。默認(rèn)為居中；

<hr>標(biāo)簽還有一些諸如title（標(biāo)題）、noshade（無(wú)陰影）等元素，這里就不一一介紹了。

排版標(biāo)簽詳解

HTML的排版不同于Word的直觀(guān)排版概念，它不是所見(jiàn)即可得的。但是，最終追求的結(jié)果是一樣的：令終端頁(yè)面的外觀(guān)像我們預(yù)設(shè)的一樣顯示出來(lái)。

在支持HTML論壇里，排版可分為常規(guī)排版和非常規(guī)排版兩種，后者屬于較為高深的內(nèi)容，出于學(xué)習(xí)的循序漸進(jìn)要求，我們?cè)诒竟?jié)只介紹常規(guī)排版。

一、格式預(yù)設(shè)：<pre>內(nèi)容</pre>

這是非常有用的一個(gè)標(biāo)簽，它可以使得最終顯示效果以原始格式實(shí)現(xiàn)。請(qǐng)看以下代碼和效果：

代碼：

<pre>1236-1207--------29</pre>效果：1236-1207--------29

論壇里，有時(shí)我們需要精確地對(duì)齊某些元素，pre標(biāo)簽?zāi)軌驇蜕洗竺?，它能令效果比在“設(shè)計(jì)”模式下用空格符移動(dòng)顯示符號(hào)更準(zhǔn)確。

二、對(duì)齊：align

align作為一個(gè)元素放置在相應(yīng)標(biāo)簽里令被該標(biāo)簽修飾的顯示單元按指定方式對(duì)齊或在圖文混排時(shí)定義圖片與文字的對(duì)齊方式。

先介紹前者即被修飾單元的對(duì)齊方式。這種情形，align通常有三個(gè)值可以選擇：left（左對(duì)齊）、center（居中）、right （右對(duì)齊），記作align=值。align不能獨(dú)立使用，它要放在相應(yīng)的標(biāo)簽里，如放在<table ...>里，則令表格按取值情況對(duì)齊，<table ... align=center>一句，將令表格居中；再如放在<p>標(biāo)簽里，則令<p>...</p>里面的內(nèi)容按指定值對(duì)齊，<p laign=right>文字</p>將使“文字”右對(duì)齊。align的這種用法還可以用于<div>、<hr>等標(biāo)簽里。

而當(dāng)align用于<img>（圖像標(biāo)簽）里時(shí)，它所指的是圖片與文字的對(duì)齊方式，其值比較多，現(xiàn)解釋如下：

left：圖片位于文字的左邊。

right：圖片位于文字的右邊。

top：后面的文字與圖片的頂站對(duì)齊。

bottom：后面的文字與圖片的底部對(duì)齊。

middle：后面的文字與圖片的中間對(duì)齊。

absmiddle：后面的文字與圖片的絕對(duì)中間對(duì)齊。

更多的img標(biāo)簽里的align元素請(qǐng)參閱其他資訊。

三、縮進(jìn)：<blockquote>

blockquote將例被修飾的對(duì)象往右邊縮退，記作<blockquote>內(nèi)容</blockquote>，以下效果是這樣的語(yǔ)法實(shí)現(xiàn)的（用了兩個(gè)縮進(jìn)單位）：<blockquote><blockquote>黑馬在線(xiàn)動(dòng)力……</blockquote></blockquote>

當(dāng)然，你也可以用空格符號(hào)實(shí)現(xiàn)縮進(jìn)（代碼記作： ），但它只管左邊的，對(duì)右邊沒(méi)有影響，而blokcquote標(biāo)簽是有的。

四、居中對(duì)齊：<center>內(nèi)容</center>

這個(gè)很簡(jiǎn)單，成組使用即可，不多說(shuō)什么了。

五、其他排版方式：表格

用表格來(lái)實(shí)現(xiàn)網(wǎng)頁(yè)布局一直被大量使用。在論壇里發(fā)帖，有些需要居中的地方，我們不妨用用表格，它得出的效果會(huì)比用center標(biāo)簽好得多。試看以下例子：

為了那一夏的熱烈

愛(ài)需要蟄居多久

在漫長(zhǎng)的暗無(wú)天日的日子里

一切早已精心策劃

單等風(fēng)和日麗之時(shí)破土而出

而后羽化成歌

烈日下本就熾熱的愛(ài)必須張揚(yáng)

讓正午的陽(yáng)光更為燥熱

讓黃昏的空氣鼓動(dòng)起來(lái)

讓愛(ài)肆無(wú)忌憚

當(dāng)愛(ài)成為陽(yáng)光下的風(fēng)景

曾經(jīng)的等待又何需憶起

如果我們將表格的邊框設(shè)置為0，那么，看表將看不到，文字的居中效果就非常理想了。

圖像標(biāo)簽

或許貼圖是論壇里最容易的事情。黑馬當(dāng)初玩論壇就愛(ài)上論壇的原因就是發(fā)圖太簡(jiǎn)單了。復(fù)制→粘貼就可以發(fā)一張圖片，這是動(dòng)網(wǎng)論壇的便利。用HTML方式貼圖，它的語(yǔ)法也是很簡(jiǎn)單。

基本語(yǔ)法：<img src=圖片地址 border=數(shù)值 align=對(duì)齊方式>

我們看到，img標(biāo)簽沒(méi)有終止符。其常用參數(shù)也不太多，非常容易記住。

src：圖片地址。在論壇里，強(qiáng)烈建議使用圖片的完整地址也就是絕對(duì)地址，若是上傳到論壇的圖片，可以使用相對(duì)地址，一般從upload一節(jié)開(kāi)始。

border：圖片的邊框。取值范圍為正整數(shù)，邊框顏色不可改變（黑色）。多數(shù)論壇里的圖片都會(huì)鏈接到自身，當(dāng)用戶(hù)點(diǎn)擊過(guò)它，它的邊框顏色通常就是默認(rèn)的藍(lán)色，故為美觀(guān)起見(jiàn)，建議設(shè)置為0。

align：圖片與文字的位置關(guān)系。這個(gè)內(nèi)容，我們?cè)谏弦还?jié)已經(jīng)講過(guò) 。

img標(biāo)簽還有其他的參數(shù)：

alt、title：說(shuō)明、標(biāo)題。都是當(dāng)鼠標(biāo)移到圖片時(shí)彈出的文字。下面是使用效果，請(qǐng)將鼠標(biāo)指針?lè)謩e移到圖片上看看發(fā)生什么：

hspace、vspace：圖文混排時(shí)圖片與左右、上下物件的距離。取值為正整數(shù)。

width、height：圖片的寬度、高度。如果圖片的高與寬未做設(shè)置，系統(tǒng)會(huì)按照?qǐng)D片的原本高寬顯示出來(lái)，但不少論壇并非這樣，論壇系統(tǒng)嵌入了一組js代碼對(duì)圖片的尺寸進(jìn)行處理：如果圖片的寬度超過(guò)300個(gè)像素則以300個(gè)像素顯示，為止設(shè)置圖片的高度寬度在這些論壇沒(méi)有意義；也有的論壇支持用戶(hù)設(shè)置，這類(lèi)論壇就需要我們對(duì)一些尺寸不合要求的圖片做一下設(shè)置了。是的，圖片不一定按原來(lái)的尺寸顯示，可以通過(guò)設(shè)置width、height值做必要的調(diào)整。

超級(jí)鏈接

在很多論壇里，我們?cè)贒esign（設(shè)計(jì)）編輯模式下輸入或復(fù)制一個(gè)網(wǎng)址或其他地址，論壇系統(tǒng)自動(dòng)令其成為超級(jí)鏈接模式，即發(fā)布后，一點(diǎn)擊這個(gè)地址，瀏覽器會(huì)打開(kāi)該地址。這是因?yàn)?，論壇系統(tǒng)在后臺(tái)給出了超級(jí)鏈接標(biāo)簽。在HTML編輯模式下，我們得自己編寫(xiě)超級(jí)鏈接代碼，否則輸入的鏈接是點(diǎn)不了的。

語(yǔ)法：<a href=地址 target=數(shù)值>文字或圖像</a>

地址沒(méi)什么可說(shuō)，只要是完整有效的網(wǎng)址即可。

target是連接目標(biāo)，它實(shí)際上指鏈接的打開(kāi)方式，它的值有好幾個(gè)，但在論壇里我們只用到_blank這個(gè)值，記作：target=_blank，意思是將在新頁(yè)面打開(kāi)目標(biāo)鏈接。如果省略掉target元素，系統(tǒng)默認(rèn)為在本頁(yè)打開(kāi)目標(biāo)鏈接，即當(dāng)前頁(yè)面的內(nèi)容將跳轉(zhuǎn)為目標(biāo)鏈接指向的內(nèi)容。一些論壇用不用target都視為開(kāi)啟新頁(yè)面打開(kāi)目標(biāo)鏈接，這里因?yàn)轭A(yù)設(shè)定了的緣故，比如，在系統(tǒng)調(diào)用的INC之類(lèi)的文件里有那么一句，它的作用就是所有的鏈接都指向新頁(yè)面：<base target="_blank"> 。這種環(huán)境下，我們對(duì)target元素沒(méi)有操作權(quán)限了。

<a href>標(biāo)簽還有title、name等屬性，但在論壇里可操作性不強(qiáng)甚至沒(méi)有用處，這里就不多說(shuō)了，感興趣的朋友可以查閱其他資訊。

現(xiàn)在我們要討論的是超級(jí)鏈接的字體顏色問(wèn)題。我們知道，論壇都預(yù)定義了字體顏色，超級(jí)鏈接樣式的字體顏色也一樣規(guī)定好了。這樣就可能存在一個(gè)問(wèn)題：當(dāng)我們的帖子設(shè)定了背景顏色，原論壇的超級(jí)鏈接顏色式樣可能不適用，會(huì)出現(xiàn)鏈接看不到的情形。比如黑馬就常用黑色背景，而黑色的鏈接字體顏色顯然是不能在黑色的背景里顯現(xiàn)出來(lái)的。我們必須處理這個(gè)問(wèn)題。

我曾考慮使用嵌入式CSS樣式表來(lái)批量自定義超級(jí)鏈接的字體顏色，一直弄不出來(lái)，也看到過(guò)有人在<table>標(biāo)簽里做文章，嘗試過(guò)，沒(méi)有效果。簡(jiǎn)單的方法還是在鏈接宿的文字前后使用<font>標(biāo)簽，語(yǔ)法樣式如下：

這樣一來(lái)，顯示是不成問(wèn)題了，只是，當(dāng)鏈接很多時(shí)，工作量還是挺大的，所以，還是應(yīng)該尋求其他的方法，比如，研究一下論壇代碼，它可能會(huì)提供幾個(gè)樣式的超級(jí)鏈接的字體顏色，通常在<head>和</head>之間可以查找得到，在CSS代碼里，它們標(biāo)志為a:link之類(lèi)的。如果有也能找出就非常方便了，我們只需要在諸如表格的<td>標(biāo)簽里加入 class=lnk1 就行了（lnk1是假設(shè)的一個(gè)名稱(chēng)）。

媒體標(biāo)簽

圖文并茂的帖子還需要有音樂(lè)、影像等媒體做襯托，帖子的整體效果才達(dá)到極致。雖然論壇一般都提供插入媒體文件的方法，但那是很有局限的，并不能滿(mǎn)足特殊的要求。為此，有必要學(xué)習(xí)和掌握媒體標(biāo)簽的使用方法。

首先我們先了解一下三種主要的音樂(lè)格式。這些音樂(lè)格式都是當(dāng)前網(wǎng)絡(luò)上較為流行的，它們更被廣泛地應(yīng)用于論壇。

出于編寫(xiě)代碼的要求，我們這里以支持這些音樂(lè)的播放機(jī)為劃分音樂(lè)格式的依據(jù)，這種劃分方法以前也是有人使用過(guò)的。

第一種：WMP格式。

WMP即為Windows Media Player的縮寫(xiě)，是微軟公司的媒體播放機(jī)，它集成在Windows系統(tǒng)里，可以格外免費(fèi)升級(jí)（網(wǎng)上一般都有下載鏈接）。其網(wǎng)絡(luò)ActiveX插件為Windows Media Player。當(dāng)前WMP所支持的音樂(lè)及影像媒體文件的格式主要有（僅介紹網(wǎng)絡(luò)上常用的格式，下同）：

MP3（音頻）、WMA（音頻）、WMV（視頻）、AVI（視頻）、MPEG（電影）、WAV（音頻）、MIDI（音頻）、ASF（視頻）、AIFF（音頻）、AU（音頻）、wpl文件（WMP播放列表文件）、m3u文件（Winamp的播放列表文件）等。

第二種：RP格式。

這是有著悠久歷史的一種媒體格式，寬帶普及以前的網(wǎng)絡(luò)媒體文件的老大，由RealNetworks公司開(kāi)發(fā)。它當(dāng)前的網(wǎng)絡(luò)ActiveX插件是Real Player G2 Control。常見(jiàn)文件后綴名為：

rax、ram、rmm、rsml、rvx、rmj、rmx、rjt、rm

REAL也支持MP3、MIDI、Wav等格式的媒體文件，但它的播放效果沒(méi)有WMP的好，所以我們不把它列入RP格式。

第三種：Flash格式。這是Macromedia公司開(kāi)發(fā)的結(jié)合音頻視頻在一塊的媒體格式。其插件為Shock Wave。文件后綴名為.swf。

弄清楚以上文件格式后，我們就可以使用<embed>標(biāo)簽來(lái)編寫(xiě)播放媒體文件的代碼了。語(yǔ)法：

格式一：<embed src=地址 autostart=值 loop=值 widht=值 height=值 type=值>

格式二：<embed src=地址 autostart=值 loop=值 hidden=true type=值>

格式一適用于顯示播放界面的情形，格式二適用于隱藏播放界面的情形。

下面分別講解各參數(shù)的取值規(guī)定和要求。

src：媒體音樂(lè)地址。地址要完整、有效。如果文件名包含非英文字符，建議整個(gè)地址用小角雙引號(hào)引起來(lái)。

autostart：是否自動(dòng)播放（即一打開(kāi)帖子就播放與否）。true為自動(dòng)，false為手動(dòng)。

loop:是否循環(huán)播放。true為循環(huán)，false只播放一次；也可用正整數(shù)表示播放多少次，比如等于3表示播放3次。

width:播放界面的寬度。建議在300到500之間。

height:播放界面的度度。這個(gè)很講究。針對(duì)音頻文件，視頻界面是沒(méi)有必要出現(xiàn)的，為此，WMP播放機(jī)設(shè)置為45非常合適，RP播放機(jī)為85較好；有視頻的則根據(jù)情況設(shè)置。

hidden:是否隱藏播放界面。格式二語(yǔ)法式樣中設(shè)置為true，即不可見(jiàn)，如果設(shè)置為false，則表示可見(jiàn)，但若不設(shè)置width和height，它的樣子是不好看的。有不少人也用width=0 height=0來(lái)隱藏播放機(jī)的播放界面，其是這樣是隱藏不了的，WMP有一個(gè)點(diǎn)，RP有一條豎線(xiàn)。

type:這是一個(gè)重要的值，用于指播放機(jī)的插件類(lèi)型，一些論壇會(huì)根據(jù)有效的src自動(dòng)給出type類(lèi)型（這類(lèi)論壇我們編寫(xiě)代碼時(shí)可以省略type），但也有的論壇不會(huì)自動(dòng)給出類(lèi)型，需要用戶(hù)指定。type的取值依據(jù)和取值規(guī)定是：

WMP類(lèi)：audio/mpeg (wma的可用audio/x-ms-wma，不過(guò)都一樣)

RP類(lèi)：application/octet-stream

Flash：application/x-shockwave-flash

注：Flash還可指定wmode=transparent表示背景透明，quality=high表示以高檔畫(huà)質(zhì)播放，pluginspage=http://www.macromedia.com/go/getflashplayer指定插件下載地址（可省略）。

類(lèi)型的指定盡量不要弄錯(cuò)，否則極可能出現(xiàn)有些朋友訪(fǎng)問(wèn)你的帖子時(shí)不能正常欣賞到音樂(lè)和影像媒體。

對(duì)于支持object的論壇，建議使用object來(lái)播放媒體文件，它得到的效果更能令人滿(mǎn)意。因其代碼較多，不便記憶，這里就不介紹了，但你可以通過(guò)FP或DW插入Web組件的方法并對(duì)ActiveX控件進(jìn)行相應(yīng)的設(shè)置得到完整的代碼。

marquee標(biāo)簽詳解

◇ 黑馬

在論壇默認(rèn)的編輯狀態(tài)下，我們可以通過(guò)UBB語(yǔ)法的move和fly語(yǔ)句讓對(duì)象動(dòng)起來(lái)，但功能很簡(jiǎn)單，只是平行地移動(dòng)。而我們使用HTML的Marquee語(yǔ)句則可以產(chǎn)生更多的移動(dòng)效果：向左、向右、向上、向下。再嵌套使用marquee語(yǔ)句，效果就更加豐富了。

marquee的基本語(yǔ)法：<marquee> ... </marquee>

說(shuō)明：與大多數(shù)HTML語(yǔ)法元素一樣，它也是成雙出現(xiàn)的，被修飾對(duì)象就放在起始符和終止符之間。請(qǐng)看如下例子：

啦啦啦，真的會(huì)動(dòng)耶！

瞧，簡(jiǎn)單吧？不過(guò)，以上例子只是使用了marquee的默認(rèn)用法。我們加入相應(yīng)的參數(shù)，它的移動(dòng)方法就有所不同了。

參數(shù)一：direction。direction的英文意思就是方向。這個(gè)參數(shù)的取值有四個(gè)：left（左)、right(右)、up(上)、down(下)。

例：<marquee direction=up>向上移動(dòng)</marquee>

向上移動(dòng)

參數(shù)二：behavior。移動(dòng)方式。值：scroll(循環(huán)移動(dòng))、slide(只移動(dòng)一個(gè)回合)、alternate(來(lái)回移動(dòng))。

例：<marquee direction=left behavior=alternate>哈哈，我來(lái)回走！</marquee>

哈哈，我來(lái)回走！

<marquee direction=left behavior=slide>累！我只走一次！</marquee>

累！我只走一次！

參數(shù)三：loop。循環(huán)。若未指定則循環(huán)不止(infinite)，其值取數(shù)值。例：

<marquee loop=3>我只走三次哦</marquee>

我只走三次哦

參數(shù)四：scrollamount。移動(dòng)速度。值取正整數(shù)。數(shù)值越大，速度越快。例：

看，我走多快！

參數(shù)五：scrolldelay

延時(shí)。數(shù)值。例：

我走一走，停一停

參數(shù)六：bgcolor

底色。例：

看到了吧？有底色！

參數(shù)七：width和height。就是移動(dòng)的寬度與高度了。例：

<marquee width=200 height=200 bgcolor=pink direction=down>這個(gè)面積不夠我移動(dòng)！</marquee>

這個(gè)面積不夠我移動(dòng)！

其他參數(shù)：空白(Margins)<hspace=數(shù)值 vspace=數(shù)值>；對(duì)齊方式(Align) <align=top/ middle/bottom>

我們?cè)诒竟?jié)所舉的例了當(dāng)中，marquee所移動(dòng)的對(duì)象都是文字，其實(shí)呢，凡可視對(duì)象，只要有足夠的區(qū)域，marquee都能令它們移動(dòng)。

表格初步

表格是在論壇做帖的重要武器。這原因是，論壇里提供給用戶(hù)操作的區(qū)域是非常有限的，用戶(hù)只能在論壇程序框架好的body區(qū)域里的某個(gè)區(qū)域施展身手，不能修改body的背景色，更不能介入head的定義，因此，諸如讓自己的帖子有底色、底圖之類(lèi)的修飾，用戶(hù)只能通過(guò)表格來(lái)實(shí)現(xiàn)。表格是一個(gè)可自定義的容器，因而它就是我們用以實(shí)現(xiàn)帖子構(gòu)設(shè)的利器。

把表格稱(chēng)作容器緣于表格的裝載特性。表格是用于裝載數(shù)據(jù)的，與我們現(xiàn)實(shí)中所看到和理解的表格非常一致。我們?cè)赪ord和Excel里都接觸過(guò)表格，知道表格有表頭、表體、單元格、行、列等等概念，它們并不難理解。而在HTML里，我們對(duì)表格的理解和運(yùn)用可能會(huì)增加一些概念，但并非復(fù)雜，在學(xué)習(xí)本教程的過(guò)程中，通過(guò)領(lǐng)會(huì)和實(shí)踐，相信是很容易掌握的。

表格不僅僅只能裝載數(shù)據(jù)，它還被廣泛地應(yīng)用于網(wǎng)頁(yè)的布局，這與表格可以將其所在區(qū)域劃分為行和列即諸多單元格密切相關(guān)。表格用于網(wǎng)頁(yè)布局過(guò)去非常流行，現(xiàn)在仍然深受歡迎，它在論壇做帖也起到不可估量的作用，帖子的頁(yè)面布局將因使用了表格而可以隨心所欲地排版。

現(xiàn)在我們來(lái)看看表格的基本代碼構(gòu)成。以下是一個(gè)完整的表格標(biāo)簽代碼框架，為了能夠一目了然，各元素尚未引入它們的屬性：

<table>

<tbody>

<tr>

</tr>

</tbody>

</table>

說(shuō)明：

<table>：表格的起始符。任意一個(gè)表格的開(kāi)始都必須以它開(kāi)頭，且必須有終止符</table>。

<tbody>：表體的起始符。緊跟在<table>之后，表示表體開(kāi)始。必須有結(jié)尾符，放在</table>之前。在純網(wǎng)頁(yè)中可以不要tbody元素，但在論壇一定要使用，否則，當(dāng)帖子用到較多的表格時(shí)，論壇的自動(dòng)填充功能將可能會(huì)導(dǎo)致代碼出錯(cuò)。

<tr>：tr的作用是規(guī)定表格的行，其中，t是table，r是row（行）。有多少組tr，這張表格就有多少行。<tr>緊跟在<tbody>之后。必須有終止符</tr>。

<td>：td的作用是規(guī)定表格的列，t是table，d可理解為down（向下）。有多少組td，這張表格就有多少列。第一個(gè)<td>緊跟在<tr>之后。終止符為</td>。td與tr配合構(gòu)成單元格。

</td>、</tr>、</tbody>、</table>：這些都是相應(yīng)元素的終止符，表示相應(yīng)元素所規(guī)范的內(nèi)容結(jié)束。必須注意它們的排列順序，不能有錯(cuò)。

從表格的代碼框架分析得出：表格標(biāo)簽里，所有元素都成對(duì)出現(xiàn)，而這些元素是按照從大到小的順序從外往里層層包裹的。table最大，它占在起始和終結(jié)的位置，tbody是老二，tr是老三，td最小，它在最里層。

本節(jié)對(duì)表格的介紹到這里打住，更多的表格內(nèi)容將陸續(xù)介紹。下課。

表格屬性設(shè)置

本節(jié)所指的表格屬性設(shè)置其概念等同于諸如FP的“設(shè)計(jì)”編輯模式下的表格屬性設(shè)置，在“設(shè)計(jì)”模式下，通過(guò)點(diǎn)擊鼠標(biāo)，可以方便地設(shè)置表格的屬性，只是，它沒(méi)有通過(guò)代碼設(shè)置的靈活。

我們先看看<table>標(biāo)簽里都有哪些需要設(shè)置的屬性。

border：此屬性定義表格的邊框。比如，border=1，表示表格邊框的粗細(xì)為1個(gè)像素（默認(rèn)值），為0表示沒(méi)有邊框。

cellspacing：?jiǎn)卧耖g距。當(dāng)一個(gè)表格有多個(gè)單元格時(shí)，各單元格的距離就是cellspacing了，如若表格只有一個(gè)單元格，那么，這個(gè)單元格與表格上、下、左、右邊邊框的距離也是cellspacing。

cellpadding：?jiǎn)卧褚r距。指該單元格里的內(nèi)容與cellspacing區(qū)域的距離，如果cellspacing為0，則表示單元格里的內(nèi)容與表格周邊邊框的距離。

width：表格的寬度。取值從0開(kāi)始，默認(rèn)以像素為單位，與顯示器的分辨率的像素是一致的。800×600的顯示分辨率下，如果表格設(shè)置成1000個(gè)像素的寬度，那么，得出的效果將導(dǎo)致IE的橫向滾動(dòng)條出現(xiàn)，只有通過(guò)滑動(dòng)它才能看到表格最右邊的內(nèi)容，所以建議在設(shè)置表格的寬度時(shí)充分考慮顯示分辨率問(wèn)題。width的取值還可以使用百分比，如widht="100%"，這種賦值法有個(gè)好處：表格的寬度將根據(jù)可顯示的寬度來(lái)自我調(diào)整寬度。

height：表格的高度，取值方法同width。提示：如果不是特別需要，建議不用設(shè)置表格的高度，系統(tǒng)會(huì)根據(jù)表格的內(nèi)容自動(dòng)設(shè)置高度。所謂特別的需要，是指一些特殊的情形下，需要表格的高度精確，比如，當(dāng)我們通過(guò)表格的背景來(lái)發(fā)一張圖片時(shí)，如果表格的高度不精確定義，圖片就不可能完整或完美地顯示。

bgcolor：表格的背景色。取值方法舉例：bgcolor=#ff0000或bgcolor=red。單元格<td>也可有此屬性，如果設(shè)置了表格的背景色，又設(shè)置表格單元格的背景色，得出的效果將是值得試試的，這種情況主要用于多單元格的表格。

background：表格的背景圖。其值為一個(gè)有效的圖片地址。<td>也有此屬性。同時(shí)設(shè)置背景色和背景圖不沖突，也建議這么做，這樣，當(dāng)圖片不能顯示時(shí)，表格的外觀(guān)依然是好看的。

bordercolor：表格的邊框顏色，當(dāng)border值不為0時(shí)設(shè)置此值有效。取值同bgcolor。

bordercolorlight：亮邊框顏色，當(dāng)border值不為0時(shí)設(shè)置此值有效。亮邊框指表格的左邊和上邊的邊框。

bordercolordark：暗邊框顏色，當(dāng)border值不為0時(shí)設(shè)置有效。暗邊框指表格的右邊和下邊的邊框。

align：表格的對(duì)齊方式，值有l(wèi)eft（左對(duì)齊，默認(rèn)）、center（居中）以及right（右對(duì)齊）。align定義的是表格自身的位置，這是一個(gè)很有用的屬性，強(qiáng)烈建議使用它來(lái)規(guī)定表格的對(duì)齊方式，盡量不要使用<p align=?>表格</p>、<div align=?>表格</div>和<center>表格</center>之類(lèi)的標(biāo)簽來(lái)規(guī)定表格的位置，因?yàn)檫@么做將導(dǎo)致論壇添加許多廢碼！此外，當(dāng)表格的寬度設(shè)置為100%，或者，表格的寬度設(shè)置成了占滿(mǎn)它所在的容器的寬度，沒(méi)有必要定義align屬性。

表格標(biāo)簽的屬性較多，使得本節(jié)有一定的難度，需要悉心領(lǐng)會(huì)并一一記住。

下面給出一個(gè)表格式樣和代碼，表格中有一些簡(jiǎn)單的說(shuō)明。

本表格的屬性設(shè)置：

邊框大小：border=1

邊框顏色：bordercolor=#ff0000

背景色：bgcolor=#cc9968

表格寬度：width=400

單元格間距：cellspcing=16

單元格襯距：cellpadding=8

表格的對(duì)齊方式（居中）：align=center

注：其他屬性未設(shè)置。

參考代碼：

<tbody>

<tr>

<td>表格里的內(nèi)容寫(xiě)在這里</td>

</tr>

</tbody>

</table>

單元格屬性設(shè)置

◇ 黑馬

在上一節(jié)對(duì)表格屬性設(shè)置的介紹中，我們提到，有一些屬于表格的屬性單元格也有，比如，背景色、寬度和高度等等。本節(jié)我們學(xué)習(xí)單元格的屬性設(shè)置，但這回我們采用不那么正規(guī)的講述方法來(lái)介紹單元格的屬性設(shè)置。

從表格的整體外觀(guān)上看，單元格是表格的基本構(gòu)成單元，一張表格至少要有一個(gè)單元格。單元格由<tr><td></td></tr>共同組成，但在一組tr里，可以擁有多組td，我們前面說(shuō)過(guò)，有多少組td該表格就有多少列；同樣，一張表格可以擁有多組tr，表格有多少組tr就有多少行。顯而易見(jiàn)，構(gòu)成表格最小單元的td，它的屬性設(shè)置是不可忽視的。

單元格的屬性設(shè)置主要體現(xiàn)在<td>里，除了我們?cè)谏弦还?jié)學(xué)到的bgcolor等之外，還有許多屬性需要掌握，令人高興的是，很多屬性的設(shè)置方法都是和<table>屬性設(shè)置一樣的，如width、height、bordercolor等。關(guān)于width，我們?cè)诖酥赜懻撘幌?。好的?xí)慣是，如果是一個(gè)單元格的表格，假設(shè)我們?cè)?lt;table>里設(shè)置了其寬度，那么，就不必再設(shè)置<td>的寬度了，因?yàn)檫@是多余的，但我經(jīng)?？吹讲簧倥笥训拇a就是重復(fù)設(shè)置的，且這么設(shè)置：<td width="100%">，顯然只是增加了帖子的代碼量，它沒(méi)有任何作用——當(dāng)有了表格寬度，單元格的寬度會(huì)自動(dòng)占滿(mǎn)表格的寬度。但是，在多列表格里，<td>的寬度就應(yīng)該設(shè)置，如若不設(shè)置，系統(tǒng)會(huì)自動(dòng)按各單元格里的內(nèi)容的占位情況自行分配寬度，效果是可想而知的。

單元格的bordercolor設(shè)置有些講究，主要用于實(shí)現(xiàn)單像素的表格邊框——要實(shí)現(xiàn)這種效果，要求表格的border為1，且<table>里設(shè)置了bordercolor顏色值，cellpadding和cellspacing都設(shè)置為0，然后將<td>的bordercolor顏色值設(shè)置為與<td>的背景色相一致。

單元格的最為重要的屬性應(yīng)該為align和valign，align規(guī)范單元格里的內(nèi)容的水平對(duì)齊方式，valign則規(guī)定垂直方向的對(duì)齊方式——請(qǐng)?zhí)貏e注意：它們規(guī)定的對(duì)齊方式是單元格里面的內(nèi)容，而不象表格里的align那樣定義自身的位置！align取值方法和前面介紹的一樣，valign的取值方法主要有：left（左對(duì)齊）、middle（居中）、top（靠頂）、bottom（靠底）等。以下是<td>的兩個(gè)對(duì)齊屬性的不同設(shè)置所產(chǎn)生的效果示例：

默認(rèn)對(duì)齊（不設(shè)置）

水平：居中

垂直：靠頂

代碼：<td align=center valign=top>

單元格元素中，<tr>也有些屬性設(shè)置，因在論壇中作用不是很大，這里就不介紹了。但有一個(gè)有趣的不屬于“屬性”的情況這里格外提一下：<tr>后面可以有文字，以下的示例的“表一”和“表二”就是放在<tr>和<td>之間的：

表一水平：居中

垂直：默認(rèn)

表二水平：右對(duì)齊

垂直：靠底

代碼：<td align=right valign=bottom>

通過(guò)探索，我們還有可能發(fā)現(xiàn)更多的書(shū)上沒(méi)有介紹的東西。建議大家安裝可以自動(dòng)填充代碼的網(wǎng)頁(yè)編輯器（如FP2003），這樣，當(dāng)我們?cè)凇按a”編輯模式下編寫(xiě)代碼時(shí)，就會(huì)看到，有很多屬性或其他內(nèi)容自動(dòng)彈出來(lái)，我們可以做些嘗試，然后通過(guò)預(yù)覽看看是什么樣的效果。

表格組合

◇ 黑馬

表格組合不是一個(gè)輕而易舉的技術(shù)，所以，我們極少見(jiàn)到論壇各種精美的帖子會(huì)用到它，但表格組合技術(shù)是一個(gè)很有趣的技術(shù)，掌握它具有一定的挑戰(zhàn)性，所以，黑馬愿意花一節(jié)的篇幅專(zhuān)門(mén)講它，如果你覺(jué)得不需要，可以跳過(guò)這一節(jié)。

表格組合更多的用于布局，當(dāng)然，也有少數(shù)情形需要用到它。本節(jié)不想探討什么時(shí)候用到表格組合，只從實(shí)現(xiàn)手段方面進(jìn)行討論。

先講上下排列的表格組合。先看例子：

表一

表二

要順利地實(shí)現(xiàn)N張表格的縱向組合，至少有三種方法：一是，令參與排列的表格都居中（即在<table>里加入align=center），上例就是；二是，不定義表格的對(duì)齊屬性，即<table>里沒(méi)有align屬性，這樣給出的N張表格代碼，它們都是上下排列的，表格的自身位置全是左對(duì)齊（但若定義了align=left，情形不是這樣，大家可以在FP或DW里試試），例子請(qǐng)看表三和表四；三是把參與排列的表格放在一張表格里，這張作為容器的外表寬度不限，且里面的表格也不設(shè)置align屬性——大家都看得出來(lái)，其實(shí)，它只是第二種實(shí)現(xiàn)方法的擴(kuò)展，其目的是為了讓參與排列的表格隨心所欲地設(shè)置水平對(duì)齊，換句話(huà)說(shuō)，外表的作用是為了實(shí)現(xiàn)自定義的對(duì)齊方式，示例為表五和表六。第三種方法雖然源于第二種，但使用它是個(gè)絕好的主意，這個(gè)，在使用表格排版過(guò)程中，相信大家會(huì)慢慢體會(huì)到的。

表三

表四

↓我叫表五表六右對(duì)齊表五

表六

下面看水平排列的表格。

表格的水平排列更需要精確地計(jì)算參與排列的表格的寬度，它們的寬度的總和不能超過(guò)其所屬容器所能裝載的寬度，表格和其他元素的混排情形下更應(yīng)該嚴(yán)格考慮。

一個(gè)好的習(xí)慣是，還是用一張表格來(lái)規(guī)范并列組合的表格，這張表格，最好寬度設(shè)置為100%，然后將里面要并列組合的表格通通設(shè)置為左對(duì)齊（但注意：它們的寬度總和不能超過(guò)可顯示的寬度）。試看以下兩個(gè)示例：

外表寬度為100% align=left

width=150

align=left

width=150

align=left

width=150

外表居中，寬度為450 align=left

width=150

align=center

width=150

align=right

width=150

本節(jié)從某個(gè)角度分析了表格的組合問(wèn)題，它是一個(gè)主要用于排版的技術(shù)，要求計(jì)算精確，并不十分適用于論壇。但如果你是一個(gè)不怕挑戰(zhàn)的人，那么，本節(jié)所討論的內(nèi)容或許對(duì)你來(lái)說(shuō)還遠(yuǎn)遠(yuǎn)不夠，好在聰明的你會(huì)自己去嘗試，本節(jié)若能起到拋磚引玉的作用就已經(jīng)達(dá)到目的了。謝謝閱讀！

多單元格表格

◇ 黑馬

在頁(yè)面布局方面，比起表格組合，多單元格更能靈活和方便地進(jìn)行控制，為此，使用多單元格布局Web頁(yè)或帖子是一個(gè)不錯(cuò)的習(xí)慣。

我們前面提過(guò)，表格代碼里，有多少組<tr>...</tr>，表格就有行，有多少組<td>...</td>，表格就有多少列。為此，在代碼里，我們將根據(jù)需要利用表格代碼里的<tr><td>...</td></tr>來(lái)創(chuàng)建單元格。我們先來(lái)制作一個(gè)1×3即一行三列的表格。

代碼：

<tbody>

<tr>

</tr>

</tbody>

</table>

效果：（1×3表格）

單元格一（即列1）單元格二（即列2）單元格三（即列3）

在上述示例里，只有一組<tr>，故而表格只有一行，<tr>...</tr>里有三組td，因此，表格有三列，這就是所謂的1×3表格?，F(xiàn)在我們把代碼擴(kuò)展一下，即增加一組tr，請(qǐng)看代碼和效果：

代碼：

<tbody>

<tr>

</tr>

<tr>

</tr>

</tbody>

</table>

效果：（2×3表格）

單元格一（即列1）單元格二（即列2）單元格三（即列3）

單元格四（即列4）單元格五（即列5）單元格六（即列6）

我們可以定義<td>里的寬度和高度值，從而讓表格以我們的預(yù)設(shè)在其所在區(qū)域進(jìn)行布局，以便達(dá)到有效的排版目的。在多行多列的表格里，當(dāng)某一列的第一個(gè)單元格已經(jīng)定義了寬度，那么，往下各單元格的寬度將跟它一致，如果同一列的所有單元格都設(shè)置了寬度，該列的最終寬度以width值最大的那個(gè)單元格為標(biāo)準(zhǔn)，——可見(jiàn)，我們只需設(shè)置某列的第一個(gè)單元格的寬度即可，其他同列的<td>不必給出width屬性，這樣一可以節(jié)省代碼二不會(huì)出現(xiàn)無(wú)效設(shè)置；表格的行的高度情形也是一樣：當(dāng)定義了某一行頭一個(gè)單元格的高度之后，該行其他單元格會(huì)自動(dòng)得到相同的高度值，不必再一一設(shè)置<td>的height屬性。盡量減少代碼量總是一個(gè)好習(xí)慣，一來(lái)可以節(jié)省空間，二來(lái)打開(kāi)速度也會(huì)得到改善——代碼越多，系統(tǒng)處理代碼的時(shí)間就越長(zhǎng)，同時(shí)也更耗可貴的系統(tǒng)資源。

我們還應(yīng)該注意的是，如果不設(shè)置<td>的width和height屬性，表格各單元格將根據(jù)里面的內(nèi)容的占位情況拓寬自己，表格給各單元格的寬度分配將由系統(tǒng)自動(dòng)進(jìn)行，這樣就容易出現(xiàn)不合理的情況，因此，應(yīng)該根據(jù)需要設(shè)置單元格的高度和寬度。

多單元格表格里一個(gè)有趣的問(wèn)題是單元格合并，其概念與Excel的合并單元格是一致的，只是實(shí)現(xiàn)方法不同。在HTML代碼里，我們用colspan屬性合并左右單元格，記作：colspan=數(shù)值，“數(shù)值”即為需要合并的單元格總數(shù)；而rowspan屬性則合并上下單元格，記作：rowspan=數(shù)值。

讓我們用上面的第二組示例表格來(lái)加工一下。先看合并左右的單元格——

代碼：

<tbody>

<tr>

<td align=center colspan=2>1，2單元格合并了</td>

</tr>

<tr>

</tr>

</tbody>

</table>

效果：

1，2單元格合并了 3

4 5 6

下面是表格的上下單元格合并——

代碼：

<tbody>

<tr>

<td align=center rowspan=2>1,4單元格合并了</td>

</tr>

<tr>

</tr>

</tbody>

</table>

效果：

1,4單元格合并了 2 3

5 6

通過(guò)HTML代碼實(shí)現(xiàn)單元格的合并略顯抽象一些，你可以研究本示例代碼和第二組代碼（2×3表格）的區(qū)別并比較兩組表格的樣式來(lái)慢慢領(lǐng)會(huì)，要完全掌握這一技術(shù)，你還需要親自做些嘗試。最后順便提一下：有些論壇可能不支持表格單元格的合并。

表格嵌套

論壇所有精美的帖子，幾乎無(wú)一例外地都用到表格的嵌套技術(shù)，其中的原因，如前所述，論壇中給用戶(hù)提供施展身手的余地十分有限，只有通過(guò)表格的修飾，帖子才能既成為獨(dú)立的顯示單位，又達(dá)到如純完整的Web頁(yè)一樣有著自己的裝飾。表格的可分割性和容器特征在帖子制作中充當(dāng)著重要的角色，兼管帖子的布局的同時(shí)還承載著表達(dá)帖子信息元素的重任。

作為容器，表格可以往里放置可以放置的元素。表格也是一個(gè)元素，故而表格放在表格里是合理的，因此就有了表格的嵌套。表格的嵌套還可以是另外的形式，那就是，一個(gè)表格的單元格里還有表格。不論是哪種形式的嵌套，理論上嵌套的層可以是無(wú)窮盡的，但現(xiàn)實(shí)中并不會(huì)這么做，我們總是根據(jù)需要有限制地使用嵌套，不會(huì)沒(méi)完沒(méi)了。

表格嵌套其實(shí)也不復(fù)雜。如果你能夠獨(dú)立用代碼做一張表格（強(qiáng)烈建議練出這樣的本事），那么，你就可以做一個(gè)兩張表格的嵌套，很簡(jiǎn)單，把代碼復(fù)制一下，粘貼在原代碼的<td>和</td>之間（亦即在“和”的位置）。試看以下代碼和兩個(gè)表格的嵌套效果：

<tr>

<td>表一

<tr>

</tr>

</tbody></table>

</td>

</tr>

</tbody></table>

表一表二

從上面的表格效果上看，如果我們把文字“表一”刪除掉，表格的嵌套將是非常完好的。如果再定義邊框大小和顏色、cellpadding和cellspaing為其他值，加上背景色和背景圖，或通過(guò)其他手段來(lái)修飾，那么，里表和外表之間，就會(huì)出現(xiàn)非常漂亮的邊框，帖子的外框就這么搞掂了。當(dāng)然，這是一個(gè)細(xì)活，你需要做反復(fù)的嘗試，直到效果滿(mǎn)意為止?；蛟S你還需要更多層的嵌套，這就看你的想象力了——實(shí)現(xiàn)手段是不難的，因?yàn)槟阋呀?jīng)會(huì)了第一層的嵌套，第二層、第三層……第N層，無(wú)非就是如此。

現(xiàn)在我們來(lái)看看多單元格表格中，在單元格是嵌入表格的示例。先看代碼：

<tr>

<td>

<tr><td class=red>我嵌套在單元格二里</td>

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

</td>

</tr>

</tbody></table>

以下是效果：

單元格一：無(wú)表格嵌套我嵌套在單元格二里

上面的兩個(gè)例子里，黑馬都將處于外層的表格（即外表）的寬度設(shè)置為450個(gè)像素，這是由于本頁(yè)面的限制。在實(shí)際制作中，我們可以充分考慮未來(lái)瀏覽者的顯示器的分辨率和論壇提供的可顯示寬度來(lái)決定取值。好的習(xí)慣仍然是取絕對(duì)值，因?yàn)?，你的帖子里邊的?nèi)容寬度非?？赡苁墙^對(duì)的，譬如圖片有著自己固定的寬度， Flash影片也是使用絕對(duì)的width值，為了不讓正文四周出現(xiàn)太多的空余，采用絕對(duì)值規(guī)范外表的寬度是有必要的。當(dāng)然，還有一個(gè)好的做法，那就是，根本不用規(guī)定外表的寬度，而是讓里邊的內(nèi)容自行撐寬外表，這么做至少要求我們注意兩個(gè)方法的問(wèn)題：一是，利用cellpadding或border的合理值來(lái)讓外表的邊緣顯示外表的既設(shè)背景，二是，外表里面的諸元素的寬度要相對(duì)統(tǒng)一。任何一種實(shí)現(xiàn)方式都還有其自身的奧妙，不是用語(yǔ)言能夠一一道明的，只有在不斷地實(shí)踐中才能逐一領(lǐng)悟和掌握。

當(dāng)今用戶(hù)的的顯示器分辨率有兩大標(biāo)準(zhǔn)：800×600和1024×768，這兩種分辨率下，以動(dòng)網(wǎng)論壇為例，用戶(hù)發(fā)帖后帖子可顯示的區(qū)域?qū)挾仁怯袇^(qū)別的。為此，你需要通過(guò)嘗試獲知具體寬度，從而制作出的帖子不至于出現(xiàn)瀏覽者不能完整欣賞的現(xiàn)象。過(guò)寬的帖子，比如超過(guò)510個(gè)像素的寬度，分辨率設(shè)置為800×600的瀏覽者將看不到帖子右邊的內(nèi)容，而太小的寬度，又可能令帖子顯得小里小氣，也不理想。

深入學(xué)習(xí)表格

◇ 黑馬

表格還有一些重要的內(nèi)容需要徹底弄懂。實(shí)際上，這些內(nèi)容，前面幾節(jié)我們已經(jīng)接觸過(guò)，但我們還需要進(jìn)一步去探討一下。

我們先來(lái)做個(gè)實(shí)驗(yàn)。

下面黑馬給出一條長(zhǎng)度為450個(gè)像素的分隔線(xiàn)，然后在分隔線(xiàn)下面放置一張表格，其寬度亦為450個(gè)像素：

border=1

cesllpadding=15

cellspacing=8

width=450

現(xiàn)在，我們看到，表格的總寬度仍然是450個(gè)像素（它沒(méi)有超越分隔線(xiàn)），因此，我們可以得出這樣的結(jié)論：表格的border、cellpadding和cellspacing雖然都是占位元素，但它們不會(huì)使得表格變得更寬，換一個(gè)更生動(dòng)的說(shuō)法，表格的這些元素是往里占位的，而不是往外占位。

第二個(gè)實(shí)驗(yàn)：設(shè)定表格的寬度為400個(gè)像素，然后在里面放置一個(gè)可視元素，令其寬度為450，看看表格的總寬度發(fā)生了什么。我們依然用一條長(zhǎng)度為450個(gè)像素的分隔分做參照。

本表格設(shè)定寬度為400個(gè)像素，但因表格里的分隔線(xiàn)寬度為450個(gè)像素，表格的實(shí)際顯示寬度發(fā)生了變化。

現(xiàn)在我們看到，雖然在<table>標(biāo)簽里設(shè)定了width=400,但表格的總寬度并不是400個(gè)像素，而是被表格里面的那條分隔線(xiàn)的實(shí)際寬度（450個(gè)像素）撐寬了。你可能會(huì)覺(jué)得奇怪：為什么表格總寬度超過(guò)了450個(gè)像素呢？道理是這樣：表格設(shè)置了cellpadding值為10，cellpadding區(qū)域是不可放進(jìn)任何可視內(nèi)容的。細(xì)心比較一下，你將發(fā)現(xiàn)，表格寬出的部分正是留空的部分，即表格的單元格襯距。

可見(jiàn)，表格里面的內(nèi)容會(huì)影響到表格的寬度。實(shí)際上，如果我們?cè)O(shè)置好表格里面的內(nèi)容的寬度，表格的width值是完全可以不設(shè)置的，但這不是一個(gè)好的習(xí)慣，我們通常仍然需要合理地設(shè)置表格的寬度，但必須留意一個(gè)問(wèn)題：表格的總體寬度是否超過(guò)了可顯示的范圍。

實(shí)驗(yàn)三：設(shè)定一個(gè)450個(gè)像素寬度的表格，表格的邊框、單元格間距和襯距都為實(shí)值，該表格有三個(gè)單元格，每個(gè)單元格設(shè)定寬度為150（加起來(lái)恰好的450個(gè)像素），看看表格的實(shí)際寬度是否發(fā)生變化。這個(gè)實(shí)驗(yàn)仍然使用450個(gè)像素寬度的分隔線(xiàn)作參照。

width=150 width=150 width=150

上面的表格，我們?cè)O(shè)置border=1，cellpadding=10，cellspacing=6，三個(gè)單元格的寬度均為150個(gè)像素，結(jié)果是：表格的總體寬度未發(fā)生變化。由此我們得出結(jié)論：多單元格表格里，只要各單元格的寬度相加起來(lái)不超過(guò)<table>里的寬度賦值，它們不會(huì)因表格邊框、單元格間距和單元格襯距都為實(shí)值而撐寬表格。

本節(jié)通過(guò)實(shí)驗(yàn)的方式，從表格的寬度角度剖析了表格的一些深層特征，估計(jì)這些知識(shí)和體驗(yàn)從其他的教程中或許是得不到的。它并不是很抽象，加上黑馬創(chuàng)造的用分隔線(xiàn)做對(duì)照標(biāo)準(zhǔn)和耐心的講解，悉心閱讀和比較后，你會(huì)很容易掌握的。

表格應(yīng)用示例一

◇ 黑馬

表格應(yīng) 用示例代碼之一

本節(jié)黑馬舉一個(gè)表格嵌套的示例向大家展示帖子的制作過(guò)程。以下是本示例的參考代碼，這些代碼得出的是本示例的整體外觀(guān)效果，內(nèi)容需要你自己往里添加，黑馬添加的是此說(shuō)明和本示例的代碼，純文字。

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

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

如果你還沒(méi)有熟悉到一看代碼就明白，你有必要看一下下面的分析。

本例有四層表格的嵌套，總共使用了六張表格。最里層是三張表格上下排列，屬表格組合。我們從外往里分析代碼。

最外層的表格，我們?cè)O(shè)置邊框值為1并定義其顏色，這樣，配合<td>的邊框顏色能夠起到外邊緣呈現(xiàn)出立體的感覺(jué)。外表的單元格襯距（cellpadding）為20，它恰好形成了帖子外邊框。外表的寬度為600個(gè)像素，這是根據(jù)本頁(yè)面而設(shè)置的，你可以在實(shí)際使用時(shí)更改。

第二層表格的原理和外層的差不多，只是，我們更改了各元素的顏色，單元格襯距也調(diào)小了，cellpadding賦值為10。

第三層表格沒(méi)有做太多的設(shè)置，我們僅令其背景色為白色、單元格襯距為10，這樣得出一個(gè)白色的邊框。

第四層表格有三個(gè)上下并列組合的表格。第一個(gè)用來(lái)放帖子的標(biāo)題；第二個(gè)表格只是用于隔開(kāi)第一個(gè)和第三個(gè)表格并令之與第三層白色底的表格連為一體，為此它的border、cellpading和cellspacing都需要設(shè)置為0，高度則為10（與第三層表格所形成的邊框一致）；第三個(gè)表格用于放置帖子的內(nèi)容，故將其單元格間距設(shè)置為10（也可設(shè)置單元格襯距），以便讓文字等內(nèi)容不至于太靠邊。

本例帖子里的代碼，黑馬采用了縮退方式編寫(xiě)，意在讓大家能夠清楚的看到不同的代碼代表不同層的表格，越縮進(jìn)的代碼越在里層（非表格代碼和自動(dòng)換行的除外）。

這個(gè)示例只是展現(xiàn)一種思路，你完全可以在此基礎(chǔ)上通過(guò)其他手段（如添加表格背景圖片、加入動(dòng)態(tài)的圖形和Flash影片等）做得更復(fù)雜、更精美一些。

表格應(yīng)用示例二

◇ 黑馬

以下是悠悠然的一個(gè)作品的框架。出于講解方便，黑馬在不改變?cè)驳那闆r下對(duì)原作品作了些改動(dòng)。

此處放一幅與標(biāo)題相關(guān)的圖片

標(biāo) 題

分隔圖標(biāo)

【正文，由六幅圖和五段詩(shī)文組成】

分隔圖標(biāo)

簽名

小圖修飾+音樂(lè)標(biāo)簽

這個(gè)作品的框架用了八張嵌套的表格，每一張表格都有背景圖片。其中外表是黑馬添加上去的，其作用是替代原來(lái)的body區(qū)域里的背景圖，而原作品中的兩張用于設(shè)置帖子正文處的表格略顯多余，黑馬已經(jīng)將其刪除，僅保留七張表格。下面給出上面帖子框架的代碼并作簡(jiǎn)單的分析。

<p align=center>此處放一幅與標(biāo)題相關(guān)的圖片</p>

<p align=center>【這里是正文，由六幅圖和五段詩(shī)文組成】</p>

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

從代碼上看，這并不是一個(gè)很復(fù)雜的構(gòu)架，它只是一個(gè)多重嵌套的方式。為更能直觀(guān)地查看各表格定義了背景圖后的效果，黑馬將各層表格拆開(kāi)來(lái)讓大家看看：

表一

表二

表三

表四

表五

表六

表七

表八

接著把這些表格像搭積木一樣一個(gè)一個(gè)地往里套，大致框架就有了，再在第八個(gè)表格放一些東西，一個(gè)完整的帖子就出籠了。請(qǐng)點(diǎn)擊下面的鏈接查看全帖子的效果：

點(diǎn)擊 →小溪流水

最后給出該帖的核心代碼。你應(yīng)該發(fā)現(xiàn)，里面又多出了一些表格。是的，它們是簡(jiǎn)單的表格，作用僅為規(guī)范詩(shī)文的居中：每一段詩(shī)文使用一個(gè)表格，共五個(gè)。

《小溪流水》核心代碼：

<p><FONT style="COLOR: #60A000; FILTER: shadow(color=#000000); FONT-FAMILY: 宋體; FONT-SIZE: 16pt; LINE-HEIGHT: 150%; WIDTH: 100%"><B>涓涓細(xì)流，<BR>是淌過(guò)我心中的小溪。<BR>潺潺清悠，<BR>是縈繞我夢(mèng)中的小溪。<BR>汨汨的清響，<BR>時(shí)常勾連起，緾綿的追憶。<BR>喃喃的絮語(yǔ)，<BR>時(shí)常叨擊那干枯的心堤。<BR><BR>你是銀河的映射，<BR>閃耀著星光的神奇；<BR>你是大海的浪花，<BR>頌揚(yáng)著莽原的博擊。<BR>你從崇山峻嶺中走來(lái)，<BR>傳遞著洪荒的信息。<BR>你從百阻千障中游離，<BR>掙扎出怪石的絆羈。</B></FONT></p>

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

<p><FONT style="COLOR: #60A000; FILTER: shadow(color=#000000); FONT-FAMILY: 宋體; FONT-SIZE: 16pt; LINE-HEIGHT: 150%; WIDTH: 100%"><B>亙古的積雪，<BR>是你生命的源頭；<BR>云霧的氤氳，<BR>是你絡(luò)繹不絕的延續(xù)。<BR>你萬(wàn)緒千頭，<BR>仿佛是樹(shù)葉的紋理；<BR>你阡陌縱橫，<BR>好似那血脈的毛細(xì)。<BR>豐厚的植被，<BR>將你醞釀成甘美的瓊漿。<BR>錯(cuò)綜的地貌，<BR>將你過(guò)濾成晶瑩的玉液。</B></FONT></p>

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

<p><FONT style="COLOR: #60A000; FILTER: shadow(color=#000000); FONT-FAMILY: 宋體; FONT-SIZE: 16pt; LINE-HEIGHT: 150%; WIDTH: 100%"><B>弦月，為你撥響撩人的琴韻；<BR>和風(fēng)，為你激蕩動(dòng)人的心語(yǔ)；<BR>陽(yáng)光，為你補(bǔ)充醉人的弦律；<BR>落花，為你揮灑戀人的情意。<BR><BR>春洪秋訊，<BR>是你激情的泛濫；<BR>冰凍懸玉，<BR>是嚴(yán)寒試圖阻止你和凡塵的聯(lián)系。</B></FONT></p>

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

<p><FONT style="COLOR: #60A000; FILTER: shadow(color=#000000); FONT-FAMILY: 宋體; FONT-SIZE: 16pt; LINE-HEIGHT: 150%; WIDTH: 100%"><B>你為宇宙而生，<BR>你為生命而育，<BR>注定了要與<BR>宇宙的喜怒哀樂(lè)<BR>交織在一起。<BR><BR>雨兒，滲透到你的魂魄，<BR>雪花，親吻著你的身軀。<BR>青春，追逐你游戲。<BR>羞澀，借助你輕靈。</B></FONT></p>

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

<p><FONT style="COLOR: #60A000; FILTER: shadow(color=#000000); FONT-FAMILY: 宋體; FONT-SIZE: 16pt; LINE-HEIGHT: 150%; WIDTH: 100%"><B>你一路輕歌，你一路逶迤，<BR>你放飛心懷，張揚(yáng)著生命的節(jié)拍；<BR>你姿意顛波，坦蕩著無(wú)瑕的心蒂。<BR><BR>為什么？我總是對(duì)你那么癡迷；<BR>為什么？我總和你有那么一段<BR> 割舍不斷的情義。<BR>因?yàn)槟抢?，也?lt;BR>　截留下我青春的腳印，<BR>因?yàn)槟抢?，也?lt;BR>　伴隨著我凄美的嘆息。<BR>青春的矯情，承受了你的蕩滌。<BR>似水的年華，定格成一個(gè)縮影。<BR>耳邊時(shí)刻回蕩著你的清音。</B></FONT></p>

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

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

表格應(yīng)用示例三

◇ 黑馬

本節(jié)要講的一個(gè)表格應(yīng)用示例比較簡(jiǎn)單：以表格為載體，在表格里面加入圖片和Flash影片以期達(dá)到所需的動(dòng)態(tài)效果。

這是很常見(jiàn)的一種做帖手段，其實(shí)現(xiàn)思路是：給表格加入一個(gè)背景圖片，這樣一來(lái)，表格仍然是可以裝載占位元素的容器，因此，我們給已經(jīng)有了背景圖片的表格加載一個(gè)Flash影片就成為可能。

應(yīng)該注意的是，表格要設(shè)置高度和寬度，且高、寬應(yīng)與用作背景圖的高、寬相一致，表格的border、cellpadding和cellspacing等值最好設(shè)置為 0（原因：為了使圖片完美顯示）。Flash影片也必須設(shè)置高度和寬度，設(shè)置為多高多寬應(yīng)根據(jù)實(shí)際顯示需要而定，但絕對(duì)不能大于表格的高度和寬度。

以下，是本示例將要用到的素材：一張圖片和一個(gè)Flash影片。

通過(guò)查看桂林山水圖片的屬性（右擊→屬性），我們可以看到圖片的尺寸為540×405，由此，我們將定義表格的寬為540，高為405。代碼如下：

<tr>

<td>此處為加載Flash影片代碼</td>

</tr>

</tbody></table>

Flash影片是幾條游動(dòng)的金魚(yú)，我們將把它們放置在相應(yīng)的水域游動(dòng)。影片底色是純白的，我們通過(guò)定義可以令底色消失，代碼是wmode="transparent"。以下是Flash代碼舉例：

OK，現(xiàn)在來(lái)看看效果：

在上例中，我們令表格內(nèi)部占位元素的垂直和水平對(duì)齊分別為底部對(duì)齊、居中，F(xiàn)lash的寬度為150、高度為180。這些，都是根據(jù)需要而定義的，可以通過(guò)反復(fù)嘗試最后確定。以下是參考代碼：

<tr>

</td>

</tr>

</tbody></table>

非常規(guī)排版技術(shù)

◇ 黑馬

在教程的前面我們提到過(guò)，論壇里用于顯示用戶(hù)的帖子的區(qū)域是有限的，在同一顯示分辨率的機(jī)器里，用戶(hù)的帖子可顯示的寬度比該分辨率的寬度要少一些。而有一些帖子，出于種種原因，我們可能不滿(mǎn)足于受限的顯示寬度，為此，有必要采用非常規(guī)排版技術(shù)，其目的是突破顯示寬度限制。

這就是所謂的“全屏技術(shù)”，即，令帖子以全屏寬度顯示。

在HTML代碼中，通過(guò)“層”技術(shù)，我們非常容易實(shí)現(xiàn)全屏顯示某一單元（帖子可視作一個(gè)單元）。“層”具有重疊性，即，在一個(gè)已經(jīng)存在的占位單元里，通過(guò)使用“層”的疊加，我們還可以在其上面再放置一個(gè)或多個(gè)單元。其結(jié)果是，多個(gè)單元的疊加，整體效果就是立體的，以下頁(yè)面的左邊的第二幅圖就是通過(guò)使用“層”技術(shù)在圖片之上疊加了一個(gè)透明的表格，從而導(dǎo)致圖片不能通過(guò)正常的右擊進(jìn)行復(fù)制：

查看上面黑馬提供的頁(yè)面，你或許還不能明白“全屏”技術(shù)的實(shí)現(xiàn)原理，但你應(yīng)該理解“層”的疊加概念。當(dāng)前較高版本的DW已經(jīng)引入了“層”的概念，用過(guò)DW的朋友理解起來(lái)可能比較容易，為了讓新手也能夠很快接受這個(gè)概念，黑馬舉個(gè)不十分確切的例子，對(duì)“層”再加以說(shuō)明：筑路，通常鋪上一層較大的石頭，這是第一層，壓緊后再鋪上碎石，第是第二層，往后還有若干層。所有的層是重疊在一起的。這些層，就是我們要用于HTML帖子里。我們知道，用img加入一幅圖片，這幅圖片占的位置不可以再加入任何內(nèi)容了，但通過(guò)“層”的疊加，我們就能夠讓其他內(nèi)容浮于圖片的上方，黑馬在線(xiàn)聽(tīng)歌臺(tái)的那個(gè)有“52”標(biāo)志的Gif圖片，就是這樣放上去的。

論壇都有固定的結(jié)構(gòu)，它規(guī)定用戶(hù)發(fā)帖所能顯示的地方是被限制好的。包含有發(fā)帖人頭像等信息的左邊欄，它已經(jīng)有了占位元素，而它恰好是占去了我們想利用的顯示帖子的寬度。那么，通過(guò)使用“層”技術(shù)，我們將帖子的左邊部分往它那里疊加，加上正?？娠@示的部分，帖子就實(shí)現(xiàn)了“全屏”寬度顯示了。同樣的道理，我們還可以讓帖子往上或往下一點(diǎn)，甚至，如果你愿意，你還可以讓帖子的頭部把論壇的功能菜單全部遮攔?。ú唤ㄗh這么做）！

不知道道理講明了沒(méi)有？呵呵，現(xiàn)在，還是來(lái)看看實(shí)例吧。

以下兩個(gè)表格，都以img方式裝載有相同的圖片，不同的是，第一張表格我們用了“層”技術(shù)，令圖片不完全在表格里面；第二張表格則是正常加載圖片的，不作任何處理。

在上例中，第一張表格里，我們?cè)趫D片代碼前后用了如下代碼：

這段代碼就是實(shí)現(xiàn)圖片部分超越表格框架亦即突破常規(guī)位置的關(guān)鍵。其中，id很重要，是系統(tǒng)識(shí)別哪個(gè)單元的重要標(biāo)志，命名時(shí)一定不要與其他的id重復(fù)；left表示要移位的單元左邊起始位置，top則是指上部開(kāi)始位置，用負(fù)數(shù)值表示往左、往上移位，正數(shù)則往右、往下移位；width和height其實(shí)指“層”的高度和寬度，通常與要移位的元素的寬度和高度相一致（論壇中可以省略width和height值，因?yàn)槲覀儾捎玫氖乔度胧绞褂谩皩印保皩印睍?huì)自動(dòng)獲取寬與高。復(fù)雜的HTML頁(yè)面不建議省略）；position表明疊加的方式，有relative（相對(duì)位置疊加）和absolute（絕對(duì)位置疊加），使用前者的話(huà)，“層”所疊加的位置不因不同的分辨率而改變，即它的位置是固定的，使用絕對(duì)疊加則相反，會(huì)因分辨率的不同而發(fā)生位置變化，比如你想讓一只蜜蜂采花粉，那么，如果你使用了相對(duì)位置，不同分辨率下打開(kāi)你的帖子，它都是在花朵上采花粉的，但如果用了絕對(duì)位置，800×600分辨率下它是在花朵上采花粉，而1024×768分辨率下，蜜蜂可能是在石頭上采的；z-index標(biāo)識(shí)“層”在所有層中的位置，因?yàn)檎搲胁豢深A(yù)知性，所以，好的習(xí)慣是把它賦值很大，以便保證它是在最上方的。

這段“層”代碼還可嵌入到其他的代碼中去。比如表格，我們可以在<table>里面插入它，表格仍然給出id，樣式如下：

上述代碼式樣里黑馬沒(méi)有定義寬度和高度——?jiǎng)偛耪f(shuō)過(guò)，可以不定義的。在這里，“層”的寬度與高度實(shí)際上就是表格的實(shí)際寬度與高度，你也可以定義。

移位技術(shù)是實(shí)現(xiàn)“全屏”顯示帖子技術(shù)的實(shí)現(xiàn)手段，通過(guò)上面的學(xué)習(xí)，如果已經(jīng)掌握了“移位”帖子的方法，那么，在實(shí)踐中多多嘗試，掌握好精細(xì)的移位尺寸（單位為像素，即代碼中的px），你就能夠在需要的時(shí)候得心應(yīng)手地讓你的帖子得以完美地呈現(xiàn)出來(lái)。

使用“全屏”技術(shù)應(yīng)該注意的事項(xiàng)：

一、盡量使用相對(duì)疊加位置方式以確保不同分辨率下帖子的移位都是按照預(yù)定義的方式進(jìn)行；

二、注意計(jì)算尺寸，盡力避免帖子將功能按鈕、菜單和相應(yīng)應(yīng)該顯示的項(xiàng)目遮攔住；

三、編輯帖子之前記得將論壇編輯框下邊的“自動(dòng)修正”功能取消，否則有可能所做的移位設(shè)置不起作用。

做帖的一些好習(xí)慣

◇ 黑馬

一、選擇一款好用的HTML編輯器。

盡管你可能對(duì)代碼非常熟練，仍然建議使用HTML編輯器，一方面，可以事半功倍、減少代碼的出錯(cuò)機(jī)率，另一方面，可以邊編寫(xiě)帖子邊查看效果以便隨時(shí)更改不如意的地方。編輯程序的版本不要太低，比如，F(xiàn)rontPage2000盡管很優(yōu)秀，但它未集成代碼編輯環(huán)境下的自動(dòng)顯示和補(bǔ)齊代碼功能，對(duì)一些標(biāo)簽的代碼自動(dòng)調(diào)整也常常令帖子面目全非，而FrontPage2003則是相當(dāng)不錯(cuò)的，功能齊全，并有代碼標(biāo)錯(cuò)功能（以非常顯眼的顏色將有錯(cuò)誤的代碼區(qū)域標(biāo)識(shí)出來(lái)），非常貼切用戶(hù)。DreamWaver的新版本則整合了圖片處理功能，比如，用一張圖片做表格的背景，可以通過(guò)動(dòng)動(dòng)鼠標(biāo)、輸入數(shù)字，輕而易舉地將此圖片割開(kāi)（當(dāng)然你需要上傳被割開(kāi)的圖片才能在帖子中使用），它還集成有圖片的簡(jiǎn)單處理，且，如果安裝了與之配套的兄弟軟件，它就更加十全十美了?？傊庉嬈鞑槐匕惭b太多，有一款用得上手的就行了。

二、如果習(xí)慣了在線(xiàn)編寫(xiě)帖子，請(qǐng)編寫(xiě)完一組完整的代碼后再切換到Design編輯環(huán)境預(yù)覽，否則論壇系統(tǒng)的自動(dòng)填充功能會(huì)將你的代碼弄得亂七八糟，極可能難以挽救。對(duì)于需要移位的帖子，在編寫(xiě)時(shí)先不要使用移位代碼，待帖子編寫(xiě)完畢并檢查無(wú)誤了，再加入移位代碼。有音頻的影視、音樂(lè)代碼也盡量在最后再放上去，因?yàn)?，一旦放了音?lè)之類(lèi)的代碼上去，如果多次切換到Design環(huán)境，音樂(lè)會(huì)同時(shí)播放，重唱一樣的音樂(lè)會(huì)弄得你難以適應(yīng)。

三、表格的居中，盡量不要使用其他的代碼來(lái)令其對(duì)齊，而是使用表格的對(duì)齊屬性代碼來(lái)完成，在table代碼里使用align=對(duì)齊數(shù)值。這是一個(gè)好習(xí)慣，也會(huì)減少?gòu)U碼的出現(xiàn)——當(dāng)使用p、div或center之類(lèi)的標(biāo)簽對(duì)齊表格時(shí)，系統(tǒng)通常會(huì)在代碼里生成大量的其他代碼，有時(shí)根本無(wú)法人為地控制。單一列的表格，也沒(méi)有必要給td賦寬度值，因?yàn)槟鞘菦](méi)有必要的，它總要占滿(mǎn)表格的寬度（前提是表格已經(jīng)定義的寬度）。

四、做帖時(shí)，對(duì)帖子所使用到的圖片尺寸盡量做到心中有數(shù)。比如，你要用表格背景圖片方式發(fā)圖，那么，表格的高與寬必須與圖片的尺寸一致。而Flash影片、WMP和RP的播放界面尺寸，也應(yīng)該在設(shè)置的時(shí)候考慮到表格的總體寬度。

五、沒(méi)有影像的音頻文件，其播放界面不要設(shè)置太大的高度，在embed標(biāo)簽里，WMP的高度45個(gè)象素最合適，RP在80上下就可以了。當(dāng)需要隱藏播放界面時(shí)，請(qǐng)最好不用將width和height設(shè)置為0，因?yàn)槟遣皇钦嬲碾[藏，好的方法是設(shè)置hidden值為true。

六、當(dāng)使用img形式發(fā)圖時(shí)，你得根據(jù)論壇的情況設(shè)置裝載有圖片的表格的寬度。多數(shù)論壇會(huì)設(shè)置了一組JS代碼來(lái)處理圖片的寬度，即當(dāng)圖片的寬度大于300個(gè)象素時(shí)，圖片就以300個(gè)象素顯示。有時(shí)，一個(gè)論壇當(dāng)時(shí)可能是這樣的設(shè)置，往后又是那樣的設(shè)置，也需要我們充分考慮到。

七、永遠(yuǎn)是在有了主題和準(zhǔn)備好素材后再做帖子，千萬(wàn)別強(qiáng)迫自己做帖。

八、不要老依賴(lài)別人的帖子代碼，因?yàn)椋@樣的話(huà)，你的創(chuàng)作能力永遠(yuǎn)得不到發(fā)揮，你只是沿著別人走過(guò)的路再走一回而已。

九、在自己的硬盤(pán)里建立一個(gè)文件夾，此文件夾下又建立若干子文件夾，當(dāng)發(fā)現(xiàn)有好的素材，就分門(mén)別類(lèi)地保存好，有條件的，能用得著的就上傳，并用一個(gè)文件記錄好它們的URL，甚至，為了更方便，不妨在本地硬盤(pán)建立一個(gè)HTML頁(yè)面，用絕對(duì)路徑顯示這些資源的真實(shí)面目。

十、對(duì)于那些優(yōu)秀的已經(jīng)發(fā)布了的帖子要有個(gè)備份，建議修改一下代碼，以相對(duì)路徑將所有資源保存在本地磁盤(pán)，這樣，當(dāng)帖子借用的資源鏈接失效后，你仍然有補(bǔ)救的余地。

本站僅提供存儲(chǔ)服務(wù)，所有內(nèi)容均由用戶(hù)發(fā)布，如發(fā)現(xiàn)有害或侵權(quán)內(nèi)容，請(qǐng)點(diǎn)擊舉報(bào)。

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