对齐行' HTML表格中的内容

时间:2016-11-21 10:16:43

标签: html

初学者HTML学习者在这里,他被卡住了!我开发了以下html代码,输出是我放在代码下面的图像。我需要将图像向上推,并将其顶部与第二行(XXXX)对齐,但无论我尝试过什么,都不起作用!

这就是页面的样子:

enter image description here



 <HTML><HEAD><TITLE>XXXXX Page </TITLE>
    
    <style type="text/css">
    * {
      padding: 0;
      margin: 0;
      font-family: georgia, palatino, "times new roman", times;
    }
    body { 
      font-size: 1em;   
      width: 80em;
      margin: 10em 2em 1em 2em;
      background-color: #F8F8F8;
    }
    * tt {  
        font-family: "lucida console", menlo, monaco, "courier new", courier,  monospace;
    }
    * td {
        font-weight: normal;
        padding: 0em 0.25em 0.5em 0.25em;
        text-align: left;
    }
    * a { text-decoration: none; color: #0033EE; }
    </style>
    
    </HEAD>
    <BODY>
    <TABLE border=0 cellpadding=20 cellspacing=10>
      <TBODY>
      <TR>
        <TD valign=bottom>
          <TABLE BORDER=0>
            <TBODY>
            <TR>
              <TD align=left valign=bottom>
                <IMG 
                alt="XXXX" border=0 height=200
                src="XXXX.jpg" width=200>
          </TD></TR></TBODY></TABLE>
             <div id="copyright">
            <center><font size="1">[XXXX]</font></center>
        </div>
        </TD>
        <TD valign=bottom>
          <TABLE>
            <TBODY>
            <TR>
              <TD vAlign=top><FONT size=+3>XXXX </FONT> [at gmail dot com] </TD>
            </TR>
            <TR>
              <TD><font size=+1>XXXX</font></TD>
            </TR>
            <TR>
              <TD><font size=+1>XXXXX</font>
            </TD></TR>
              <TR>
              <TD><font size=+1>XXXXX<br><br>
                XXXX<br>
                XXXX <br>
                XXXX </font>
            </TD></TR>
              <TR>
              <TD>&nbsp;</TD>
            </TR>
            <TR>
              <TD><font size=+1><b>XXXX</b></font>
            </TD></TR>
            <TR>
              <TD valign=bottom><font size="+1"><B>XXXX</B>
                &nbsp; | &nbsp; <A href="Alpha.pdf">YYYY</A>
                </font>
              </TD>
            </TR>
          </TBODY>
        </TABLE>
      </TD>
    </TR>
    </TBODY>
    </TABLE>
    </BODY>
    </HTML>
&#13;
&#13;
&#13;

2 个答案:

答案 0 :(得分:2)

将此添加到您的CSS:

td { vertical-align: top; }

答案 1 :(得分:0)

 <HTML><HEAD><TITLE>XXXXX Page </TITLE>
    
    <style type="text/css">
    * {
      padding: 0;
      margin: 0;
      font-family: georgia, palatino, "times new roman", times;
    }
    body { 
      font-size: 1em;   
      width: 80em;
      margin: 10em 2em 1em 2em;
      background-color: #F8F8F8;
    }
    * tt {  
        font-family: "lucida console", menlo, monaco, "courier new", courier,  monospace;
    }
    * td {
        font-weight: normal;
        padding: 0em 0.25em 0.5em 0.25em;
        text-align: left;
    }
    * a { text-decoration: none; color: #0033EE; }
    </style>
    
    </HEAD>
    <BODY>
    <TABLE border=0 cellpadding=20 cellspacing=10>
      <TBODY>            
	  <TR>
         <TD /><TD vAlign=top><FONT size=+3>XXXX </FONT> [at gmail dot com] </TD>
      </TR>
      <TR>
        <TD valign=top>
          <TABLE BORDER=0>
            <TBODY>
            <TR>
              <TD align=left valign=bottom>
                <IMG 
                alt="XXXX" border=0 height=200
                src="XXXX.jpg" width=200>
          </TD></TR></TBODY></TABLE>
             <div id="copyright">
            <center><font size="1">[XXXX]</font></center>
        </div>
        </TD>
        <TD valign=bottom>
          <TABLE>
            <TBODY>

            <TR>
              <TD><font size=+1>XXXX</font></TD>
            </TR>
            <TR>
              <TD><font size=+1>XXXXX</font>
            </TD></TR>
              <TR>
              <TD><font size=+1>XXXXX<br><br>
                XXXX<br>
                XXXX <br>
                XXXX </font>
            </TD></TR>
              <TR>
              <TD>&nbsp;</TD>
            </TR>
            <TR>
              <TD><font size=+1><b>XXXX</b></font>
            </TD></TR>
            <TR>
              <TD valign=bottom><font size="+1"><B>XXXX</B>
                &nbsp; | &nbsp; <A href="Alpha.pdf">YYYY</A>
                </font>
              </TD>
            </TR>
          </TBODY>
        </TABLE>
      </TD>
    </TR>
    </TBODY>
    </TABLE>
    </BODY>
    </HTML>