2013-05-25 67 views
0

我正在使用DreamWeaver MX創建我的網頁。我使用嵌套表格。一個只有一行一列的主表(W = 99%,H = n個像素)和一個具有重複模式的背景圖像。第二個主表(W = 990個像素,H = n個像素)插入並居中在第一個主表內。這是爲了使頁面適合990xn像素的所有屏幕,並且通過背景圖像完成了很好的邊框。如何刪除插入Doctype後出現的空格或空行

第二個主表有3個區域:頂部的標題區域(水平寬度與第二個主表格相同),左側的菜單區域和右側的菜單區域,比另外兩個區域大區域。我也有一個小小的水平表,一行三列插入標題區。這是爲了包含圖片和標題的文字。還有一些小表格:一個插入菜單底部的菜單區域,以便包含三個「關注此社交網絡」按鈕,在文本區域中插入一個或幾個小表格以包含圖片,一個小表格表格以包含Disqus評論。

一切工作正常。我網站上的所有頁面都顯示爲我想要的Chrome,Firefox,IE8和IE9。然後,我將Disqus評論系統插入一些頁面。具有Disqus評論系統的網頁在Chrome和Firefox中顯示效果良好,但在IE8和IE9中,這是一團糟,評論佔據了所有寬度,並使我的網頁大部分內容消失。

爲了在IE8和IE9中正確顯示Disqus評論,我在包含Disqus評論的網頁的第一行中插入了過渡性Doctype聲明的代碼:。這一行動使我能夠在Chrome,Firefox,IE8和IE9中正確顯示Disqus評論系統,但現在所有瀏覽器都存在一個小問題:我的水平單元格行之間有空格(空行)第二個主表格和最近的文本行(這就像是一個額外的水平填充;初始垂直和水平填充保持不變)。這些不合需要的空格中的每一個都具有段落中斷的大小。

這裏有兩個網址,讓您以可視化的問題:

    在我的地盤, http://pikpratik.com/的主頁
  • ,不包含DOCTYPE聲明,無形表細胞系和最近之間的空間文字行是確定的。
  • 在頁面http://pikpratik.com/fichye/pou_redui_risk_viktim_aksidan_sou_wout.htm的頂部,空格顯示清楚,特別是在標題(單元格行不可見)和第一行文本(Akèy> Jesyon risk ak dezas>)之間以及最後一行之間(Akèy|Kiyèsnou ye | Di sa w panse de sit sa a | Plan sit la | Kontak)和我的第二張主桌的下邊界。

重要說明:當我將過渡性DOCTYPE聲明代碼和Disqus評論系統關閉時,這些表格在所有瀏覽器上都正確顯示。

我的問題是:我應該怎麼做才能去除這些空白?

我不知道如何使用CSS。請給我一個沒有CSS的解決方案。如果唯一可用的解決方案包含CSS,請給我完整的代碼和準確的位置(我必須在我的網頁中插入代碼)。

+0

回答所有你的問題在於你的第二個句子*我使用Dreamweaver MX * – Eonasdan

回答

0

我終於找到了所見即所得的解決方案,同時使用DreamWeaver MX。這很簡單。這種解決方案允許我去除多餘的空白空間,並在構成我的文本區域的大單元格內具有均勻的行間距。它特別允許我有一個正常的距離:a)單元格的上邊框和單元格中的第一行文本之間b)單元格的最後一行文本與單元格的下邊框之間。我必須說,我在我的網站的所有頁面中添加了過渡性的Doctype聲明。這樣,我的網站看起來更專業。

我做了什麼:

在DreamWeaver MX中,我選擇了我的第一個主表。 CellPad的編號爲空(空白)。我將它設置爲0。於是,我只好:CellPad = 0,CellSpace = 0,邊境= 0

我選擇了我的第二個主表。我有CellPad = 3,我將它設置爲2,所以我必須:CellPad = 2,CellSpace = 0,邊境= 0

我選擇具有一行三列我的頭表。中間的單元格有一張背景圖片和一些文字(網站名稱,網站網址和網站標語),以及在第四行文字中插入海地國旗的四張非常小的圖片。左邊的單元格只包含一張插入其中的圖片。同樣在右邊的單元格。對於我的頭表,我有:CellPad = 3,CellSpace = 3,Border = 0.我改變了這個,所以現在我有:CellPad = 0,CellSpace = 0,邊界= 0.對於我的頭表,我也有:寬度= 100%,高度= 162像素,與中間單元的背景圖片的高度相同。

我選擇左側的畫面(150×150像素)在我的頭表:垂直邊距=空白,H空間=空,邊框=空白。我設置:V空間= 0,H空間= 0,邊界= 0.同樣的圖片(137x150像素)在右邊。我選擇了四個小(15x10像素)海地國旗之一:V空間=空白,H空間=空白,邊界= 1。我設置:V空間= 0,H空間= 0,我讓邊界= 1。同上另外三個小海地國旗。

我左鍵單擊我的表頭左列中的空格(光標閃爍在右邊框或所含圖片的左邊界上):W = 19%,H =空白。我設置H = 162.我左鍵單擊我的表頭中間列的空間:W = 62%和H =空白。我設置H = 162.我左鍵單擊我的表頭中間列的空間:W = 19%和H = 162。沒問題,沒有必要更改。

我在「顯示代碼視圖」去了,我把光標立即對「HEIGHT =‘170’」的權利,在代碼行。我回到了「顯示設計視圖」,我看到我的第二個主表包含我的表頭的頂部單元格被選中:寬度=空白,高度= 170.我讓寬度=空白,我設置高度= 162.我保存並且自動地,我只有一行用於我的標題,而不是幾行對應於不同高度的表或單元格的行。然後,我進入頁面底部,將第二張主桌的高度拉伸至最小,並將第一張主桌的高度拉高。

的問題是在cellpad和我的第二個主表和它的頂部單元格高度的cellspace。他們太高了。我不得不減少它們,因爲它們之間增加了一個,並增加了單元格頂部邊框和單元格中第一行文本之間的垂直空白。我不得不將cellpad和cell頭表的單元格空間設置爲零,因爲它們不是必需的。我可以爲我的第二個主表設置cellpad = 0,但是我的文本區域中的文本不會很好閱讀(太靠近垂直邊緣)。所以我減少了這個單元格(從3到2),因爲它也有助於單元格頂部邊界和單元格中第一行文本之間的空白a)b)單元格最後一行文本與單元格的下邊框。

如果我可以單獨設置一個表格單元的填充而不是設置整個表格的填充,則可以完全防止多餘的垂直空白。

設置爲零圖像的「V空間」和「H空間」並不是真的必要,只是一個預防措施。

我觀察到,水平細胞系和最近的文本行之間的空白空間默認設置爲等於兩個段落之間的間距。母親表的cellpadding和CELLSPACING被添加到這個空白,如果這些CELLPADDING和CELLSPACING未設置爲0。

前景:

找到一種方法,單獨設置單元格的CELLPADDING。

找到一種方法,以便a)第一行文本(在表格單元格中)與上面單元格邊框之間的垂直距離低於兩段落間距的高度b)垂直距離在文本的最後一行和下面的單元格的邊框之間的距離小於兩個段落之間的間距的高度。

獲取DreamWeaver的最新版本,因爲我已經使用MX超過10年了。現在必須提供許多新的所見即所得選項才能獲得我的網頁所需的演示文稿。

學習如何使用CSS,只要有機會,因爲很明顯CSS提供了更多的可能性,並且據說嵌套表減緩了網頁的加載速度。

0

那裏看來是在表格單元格的頂空parargraph(<p>&nbsp;</p>) - 見下面的代碼片段的第二行:

  <td width="235" height="821" valign="top" bgcolor="#FFFFFF"> 
      <p>&nbsp;</p> 
      <ul> 
       <li><font color="#0000FF" size="2" face="Arial, Helvetica, sans-serif" align="left"><strong><font face="Courier New, Courier, mono"><a href="../index.htm">Ak&egrave;y</a></font></strong></font></li> 
      </ul> 

這也許可以解釋你的間距問題

+0

我剛纔已經移除了類似的頁面此行

 

http://pikpratik.com/fichye/leksik_pik_pratik.htm 。問題依然存在。感謝您的參與。 – PikPratik