CSS表格樣式

Question

CSS是我的弱項，現在我正在嘗試改進它，請您幫助我找出問題所在，以及我缺少的CSS樣式。

<table>
  <tr>
    <td style=width:"177px; height:92px"><img src="logo.png"></td>
    <td rowspan="2"><img src="img2.png"></td>  
  </tr>
  <tr>
    <td style=width:"177px; height:100px"><img src="img1.png"></td>
  </tr>
  </tr>
</table>

更新：我忘了提到我正在處理HTML電子郵件，因此解決了我的問題。 謝謝你的幫助

Answer 1

我認為您只需要將表格默認設置為CellSpacing和CellPadding 0（假設帖子中的頂部圖片是理想的結果）

 <table cellpadding=0 cellspacing=0 >

雖然DIV可能更容易

<div>
  <div style = width:"177px; height:92px; float:left;">
       <img src="logo.png"><br />
       <img src="img2.png">
  </div>
  <div style=width:"177px; height:100px; float:left;">
      <img src="img1.png">
  </div>
</div>

然后，讓我們進一步前進1

<style>
.wrapper
{
    background-color:#ccc;
    padding:5px;
}
.content
{
    width:177px; 
    height:100px; /*Made them both 100px although one was 92px, this may not be correct*/
    float:left;
}
</style>


<div class="wrapper">
  <div class="content">
       <img src="logo.png"><br />
       <img src="img2.png">
  </div><!--/content-->
  <div class="content">
      <img src="img1.png">
  </div><!--/content-->
</div><!--/wrapper-->

Answer 2

您要查找的屬性可能是border-spacing ，例如EG border-spacing: 0; （ 其他表格特定的CSS屬性 ），但是您不妨先咨詢本主題： 為什么不使用表格在HTML中進行布局？

Answer 3

試試這個：

的CSS

  table {border:1px solid #ccc; 
 .logo{ width:100px; }.img2{ width:300px } 

的HTML

<table cellpadding="0" cellspacing="0">
  <tr>
    <td class="logo">
     <img src="logo.png" /><br />
     <img src="img1.png">
    </td>
    <td class="img2"><img src="img2.png"></td>
  </tr>
 </table>

Answer 4

高度是問題。 降低logo.png圖像的高度。