如何定位表格中的某些列

我在定位表格中的某些文本時遇到了問題。如何定位表格中的某些列

我有colspan="4"兩列 - 這是first column和second column：

它不應該是這樣的：

 
first column second column 
some text  Value Currency 
       100 USD 
       3000 USD

但正如我已經做到了，它看起來就像是：

 
first column second column 
some text    Value Currency 
         100 USD 
         3000 USD 
         12000 USD 
         400 USD

這是我真正的代碼：

<tr> 
    <td colspan="4"> 
    First column 
    </td> 
    <td colspan="4"> 
    Second column 
    </td> 
</tr> 
    <tr class="empty"><td colspan="8">&nbsp;</td></tr> 
    <tr> 
     <td colspan="4"> 
      <?php echo 'Price';?>: 
     </td> 

     <td colspan='1' style="text-align: right"> 
      <?php echo 'Value';?> 
     </td> 
     <td style="padding-left:10px" colspan='1' > 
      <?php echo 'Currency';?> 
     </td> 
     <td colspan='2'>&nbsp;</td>  
    </tr> 
<tr> 
    <td colspan="4"> 
     </td> 
     <td colspan="1" style="text-align: right"><?php echo $price; ?></td> 
     <td colspan="1" class="pull-right"><?php echo $currency; ?></td> 
     <td colspan="2" style="height:10px;">&nbsp;</td> 
</tr>

.pull-right { 
       padding-left: 10px; 
      }

來源

2015-09-03 ci_lover

'<？PHP的回聲 '價格' ;?>真的嗎？ –

'<？php echo $ currency; ''缺少''。 – connexo

我的文字較大，有變量和其他代碼，所以我減少了它。這就是爲什麼它看起來像這樣：<？php echo'Price';？>不會丟失，它是在複製時。 –

您對此代碼有幾個問題。首先，你應該總是將你的行嵌套在一個表中。其次，你所擁有的價值和貨幣應該是一個嵌套表格，但是你正試圖在沒有合適的html的情況下重現那種佈局。嘗試使用以下模板來實現您的目標。我已經測試過它，它確實產生了你所要求的確切佈局。

<table> 
    <tr> 
     <td colspan="2" style="text-align: center;"> 
      First Column 
     </td> 
     <td colspan="2" style="text-align: center;"> 
      Second Column 
     </td> 
    </tr> 
    <tr> 
     <td colspan="2" style="vertical-align:top;text-align: center;"> 
      Some Text 
     </td> 
     <td colspan="2"> 
      <table style="text-align: center; width: 100%"> 
       <tr> 
        <td> 
         Value 
        </td> 
        <td> 
         Currency 
        </td> 
       </tr> 
       <tr> 
        <td> 
         100 
        </td> 
        <td> 
         USD 
        </td> 
       </tr> 
       <tr> 
        <td> 
         3000 
        </td> 
        <td> 
         USD 
        </td> 
       </tr> 
      </table> 
     </td> 
    </tr> 
</table>

這裏是結果（加邊框）：

來源

2015-09-03 17:31:50

它仍然是一樣的。問題在於，價值是正確的，它不在「第二列」文本下。 –

我之後注意到了一些問題，所以我進行了更新。我發佈的模板應該適合你。 –

我剛剛注意到與對齊的小問題後再次更新。現在試試看，我100％肯定這篇文章會回答你的問題。 –

您需要刪除<td colspan="2" style="height:10px;"> </td>來得到想要的結果。而不是在其他列上使用，請改爲使用<td colspan='2'>。

HTML

<table> 
<tr> 
    <td colspan="4"> 
    First column 
    </td> 
    <td colspan="4"> 
    Second column 
    </td> 
</tr> 
    <tr class="empty"><td colspan="8">&nbsp;</td></tr> 
    <tr> 
     <td colspan="4"> 
      Price 
     </td> 

     <td colspan='2' style="text-align: right"> 
      Value 
     </td> 
     <td style="padding-left:10px" colspan='2' > 
      Currency 
     </td> 
    </tr> 
<tr> 
    <td colspan="4"></td> 
    <td colspan="2" style="text-align: right">Price 1</td> 
    <td colspan="2" class="pull-right">Currency 1</td> 
</tr> 
</table>

Working Fiddle

PS：您不需要使用PHP echo打印那些靜態文本

變化來自：

<td colspan="4"> 
    <?php echo 'Price';?>: 
</td>

要：

<td colspan="4"> 
    Price: 
</td>

來源

2015-09-03 17:36:25

沒有必要強迫在此表colspans，它看起來像它可以簡單地與每個TR三款TD的完成

繼承人我如何重建表：

<table> 
    <tr> 
     <td>First column</td> 
     <td>Second column</td> 
     <td>&nbsp;</td> 
    </tr> 
    <tr class="empty"> 
     <td>&nbsp;</td> 
     <td>&nbsp;</td> 
     <td>&nbsp;</td> 
    </tr> 
    <tr> 
     <td><?php echo 'Price';?>:</td> 
     <td style="text-align: right;"><?php echo 'Value';?></td> 
     <td style="padding-left:10px;"><?php echo 'Currency';?></td> 
    </tr> 
    <tr> 
     <td style="height:10px;">Some Text</td> 
     <td style="text-align: right;"><?php echo $price; ?></td> 
     <td style="padding-left:10px;"><?php echo $currency; ?></td> 
    </tr> 
</table>

來源

2015-09-03 17:37:07

謝謝大家，但沒有任何改變..如果有人想給他看檔案？ –

爲了達到我認爲你應該看起來的樣子，請考慮以下代碼：

<table> 
    <tr> 
     <td colspan="4">First Column</td> 
     <td colspan="4">Second Column</td> 
    </tr> 
    <tr> 
     <td rowspan="3" colspan="4" style="vertical-align:top;">Some Text</td> 
     <td>Value</td><td colspan="3">Currency</td> 
    </tr> 
    <tr> 
     <td>100</td> 
     <td colspan="3">USD</td> 
    </tr> 
    <tr> 
     <td>3000</td> 
     <td colspan="3">USD</td> 
    </tr> 
</table>

，但我沒有看到在第一和第二列在colspan="4"感。如果您刪除所有colspan屬性，只是添加colspan="2"與「第二列」行會看起來是一樣的，並不太複雜。

來源

2015-09-03 17:42:55 ahuemmer

如何定位表格中的某些列

回答

相關問題