|
表格的變形及其解決
許多朋友問秋實，說，做的網頁在不同的屏幕分辨率時、或改變窗口時常出現一些頁面變形情況，就這些情況，我們一一作解，祈于朋友們的網頁制作有所益！
一、因為表格排列設置而在不同分辨率下所出現的錯位
. 這種變形情況是：
1、在800*600的分辨率下時，一切正常，而到了1024*800時，則多個表格或者有的居中，有的卻左排列或右排列，很難看，這是什么原因呢？
在解決這個問題之前，我們講一下表格的排列。表格有左、中、右三種排列方式，如果沒特別進行設置，則默認為居左排列，不用說了，這就是問題之所在。在800*600的分辨率下，表格恰好就有編輯區域那么寬，不容易察覺，而到了1024*800的時候，就出現的，解決的辦法比較簡單，即都設置為居中，或左或右。
2、同樣是這種分辨率切換，表格的上下排列不一致。
上邊的所說的是水平錯位，而這種則是縱向錯位，多發生在一個表格單元里嵌入另一個表格的情況。其原因在于，嵌入的表格默認為豎向居中排列，在800*600分辨率時，這種錯位看不出來，而到1024*800就出現了，解決辦法如前，根據情況對排列進行設置，而不是采用其默認設置。
二、采用百分比而出現的變形
這里所說的百分比是指表格的高或寬設置為上層標記所占區域高或寬的百分比，如在一個表格單元的寬度是600，在它里面嵌入了另外一個表格，表格寬度占表格單元的50%，則這個表格的寬度為300，依此類推，如果在一個表格不是嵌于另一個表格單元中，則其百分比是相對于當時窗口的寬度的，常出現在IE瀏覽器中，隨便改動主頁窗口的大小時，表格的內容也隨之錯位、變形，這是因為表格的百分比也要隨著窗口的大小而改變成相應的百分比寬度。
當然了，解決辦法是不要設置成百分比，我提倡的是，如果表格沒有外圍嵌套標記，則將寬等設置成固定寬度，如有外圍嵌套標記，則將外轉嵌套標記的寬度設置為固定值，而表格的寬或高可設置為百分比，這樣就不會出現變形了。
三、表格單元格之間互相干擾引起的變形
這種變形情況通常是在工具里制作主頁時沒有空隙，而在瀏覽時卻發現莫名其妙地多出一些空隙，而又不知原因在哪，很是令人討厭。
本人也經常遇到類似的情況，解決辦法一是先看表格設置有沒有上面所談的兩種情況，如沒有，可能就是在划分表格時，同一行的單元格之間相互牽制所出現的問題。
我們知道，同一行的表格單元在諸如DreamWeaver 或FrontPage中經常頻繁地被拆分，所以，同一行的單元格與另一個單元格的寬與高不一致，這時，你就要注意兩個單元格屬性：colspan、rowspan。colspan表示的是橫向擴展，而rowspan則表示的是縱向擴展，這個擴展的意思即當前表格單元相鄰的橫向與豎向的表格單元數，也可這樣理解為表格單元的高或寬是相鄰几個表格單元的高或寬的相加和，如下圖。
這個單元格橫向所占用的寬度是3個表格單元的寬度（這里取最大值），即colspan=3﹔而豎向的高度是三個表格單元高度的總和，即rowspan=3。
那么我們說的這種變形就和這個設置有關，如果改變相鄰單元格的高或寬與個數時，圖中所指的單元格也會發生相應的變化，相互制約，調整起來很麻煩，這非我們所希望的，我本人提倡，如果表格比較復雜，最好采取嵌表格的形式，這樣，可以少一些單元格之間相互干擾情況，而使單元格之間相對獨立。
出現變形有情況還很多，我們就不一一陳述，我建議你在划分表格時，除了一些必要的高、寬設置外，將其它的高、寬設置全部刪掉，一則減少了冗余代碼，另則，也免除一些摸不著頭腦的錯誤。
|
