2016-11-14 73 views
1

因此,我正在構建我正在進行的在線展覽的最後一頁。最後一頁使用與展覽中較早頁面完全相同的格式(圖像的左側和圖像右側的一段),因此我只複製/粘貼了所有代碼並更改了URL,文本和維度圖像和TD元素,我需要。我已經改變了與頁面上各種元素的對齊方式,但是現在我有一個基本上忽略了td valign =「top」的元素,並且看起來與中心對齊。我已經完成了新頁面的html和原始行的比較,但是我找不到任何應該改變它的東西。基本上,頁面的文本部分(頁面標題本體頁面)應該在圖像頂部的同一行上開始,但是它在大量空白空間後開始在中間。HTML忽略valign

下面是去掉文字和完整URL的問題的具體表,使它有點短:

<table width="917" border="0"></br> 
<tr> 
    <td width="400" valign="top">     
    <table width="10" border="1" align="center" bordercolor="#8AC3C9"> 
     <tr> 
      <td width="184" bordercolor="#8AC3C9"><div align="center"><a href="*image*" target="_blank"><img src="*image*" alt="image" width="400" height="267" hspace="1" vspace="1" border="0" align="middle"></a></div></td> 
     </tr> 
     <tr> 
      <td bordercolor="#8AC3C9" bgcolor="#8AC3C9"><div align="center" class="style2">*Image*</td> 
     </tr> 
     </table> 
     </div>   
    </td> 
    <td width="500" "valign="top"><div align="center"><font size="+2" face="Georgia"><b>*Title of page*</b></font></div></br> 
    <div align="justify"><font face="Georgia">*Body of page* 
    </div></td>   
</tr>  

+0

不要使用表格來佈局。相反,使用flex。 – SLaks

+1

使用[驗證器](https://validator.w3.org/nu/)。你的屬性名稱前面有一個流氓的'''(同時請學習CSS,它不是1995年) – Quentin

+1

這樣做,謝謝,另外,我幾乎不知道html。一直在從頭開始學習,通過清理我們網站的舊部分(我爲公共圖書館工作),整個事情將在未來幾個月內轉移到Wordpress,所以舊的錯誤代碼不會再成爲問題了。無論如何 – Ontarah

回答

2

有一個「在VALIGN的前面,所以它不是讀取屬性。

<td width="500" "valign="top"><div align="center"> 

完整的代碼應該是:

<table width="917" border="0"></br> 
<tr> 
    <td width="400" valign="top">     
    <table width="10" border="1" align="center" bordercolor="#8AC3C9"> 
     <tr> 
      <td width="184" bordercolor="#8AC3C9"><div align="center"><a href="image.htm" target="_blank"><img src="http://placehold.it/400x267" alt="image" width="400" height="267" hspace="1" vspace="1" border="0" align="middle"></a></div></td> 
     </tr> 
     <tr> 
      <td bordercolor="#8AC3C9" bgcolor="#8AC3C9"><div align="center" class="style2">*Image*</td> 
     </tr> 
     </table> 
     </div>   
    </td> 
    <td width="500" "valign="top"><div align="center"><font size="+2" face="Georgia"><b>*Title of page*</b></font></div></br> 
    <div align="justify"><font face="Georgia">*Body of page* 
    </div></td>   
</tr> 

這裏有一個工作codepen:http://codepen.io/vic3685/full/vyKmwg/

+0

修復了它,謝謝! – Ontarah

+0

很酷!你可以標記爲已回答? 謝謝! –