PHP/HTML - 表格寬度

我在做一個使用HTML和PHP的網頁。下面，我附上我的問題的照片。PHP/HTML - 表格寬度

enter image description here

我的第一個問題是，我不能給我想要的表格格式：

我想調整的內容列1，2，3和4
第5列（最後一列）應該有更好的空間。
最後一列的aaaaaaaaaaaaaaaa不應超出表格。在到達列結束時應該將其分開或換行。

這一塊我的代碼：

echo "<table><tr>"; 
echo '<td width="40">ID</th>'; 
echo '<td width="50">Organism</th>'; 
echo '<td width="50">Chromosome</th>'; 
echo '<td width="50">Gene name</th>'; 
echo '<td>Sequence</th>'; 
echo "</tr>"; 
while($row = mysqli_fetch_array($result2)) { 
    echo "<tr>"; 
    echo "<td>$row[id_send]</td>"; 
    echo "<td>$row[organism]</td>"; 
    echo "<td>$row[chromosome]</td>"; 
    echo "<td>$row[gene]<br></td>"; 
    echo "<td>$row[sequence]</td>"; 
    echo "</tr>"; 
} 
echo "</table>";

來源

2013-12-13 user2886545

如果您的用戶實際上正在輸入這樣的數據，那麼您存儲的是什麼數據？大多數人使用空格鍵。它將在一個空間中斷裂。 – Jessica

YeeeeHAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!嗯，看起來像SO有類似的問題... – j08691

這是一個測試，但它會是這樣的。「aaaaaaaaaa」表示DNA序列「GGGCCCCTTTAAAAGGAGAGAGATGGTTTG」 – user2886545

你可以使用這個CSS的表。

.wrapText 
{ 
    table-layout:fixed; 
    width: 100%; 
    word-wrap: break-word; 
}

但是，「break-word」會打破單詞並將它們包裝到下一行，這可能會使文本無法讀取。

來源

2013-12-13 21:46:00 Poornima

.table { 
    margin-bottom: 30px; 
    border-top: 1px solid #aaa; 
    border-left: 1px solid #aaa; 
    border-right: 1px solid #ccc; 
    border-bottom: 1px solid #ccc; 
} 
.tableHeading { 
    font-size: 18px; 
    font-weight: bold; 
    text-transform: capitalize; 
    color: #000000; 
    padding: 5px; 
    background: url('/images/table-2-head-bg.gif'); 
    background-repeat: repeat-x; 
    background-color: #f7f7f7; 
    border-top: 1px solid #fff; 
    border-left: 1px solid #fff; 
    border-bottom: 1px solid #aaa; 
    border-right: 1px solid #aaa; 
} 
.tableSubHeading { 
    padding: 5px; 
    color: #666666; 
    border-top: 1px solid #fff; 
    border-left: 1px solid #fff; 
    border-bottom: 1px solid #aaa; 
    border-right: 1px solid #aaa; 
} 
.tableMassActionCell { 
    padding-top: 10px; 
    padding-left: 10px; 
    font-size: 12px; 
    font-weight: bold; 
    background-color: #f7f7f7; 
    border-top: 1px solid #fff; 
    border-left: 1px solid #fff; 
    border-bottom: 1px solid #aaa; 
    border-right: 1px solid #aaa; 
} 
.tableColumnHeader { 
    font-weight: bold; 
    font-size: 12px; 
    background-color: #EEEEEE; 
    padding: 5px; 
    border-top: 2px solid #fff; 
    border-left: 2px solid #fff; 
    border-bottom: 1px solid #aaa; 
    border-right: 1px solid #aaa; 
} 
.tableRowNoResults { 
    font-weight: bold; 
    background-color: #ffccff; 
    text-align: center; 
    padding: 10px; 
    border-top: 1px solid #fff; 
    border-left: 1px solid #fff; 
    border-bottom: 1px solid #aaa; 
    border-right: 1px solid #aaa; 
} 
.tableRowLeft1 { 
    font-weight: bold; 
    background-color: #f7f7f7; 
    padding: 5px; 
    border-top: 1px solid #fff; 
    border-left: 1px solid #fff; 
    border-bottom: 1px solid #aaa; 
    border-right: 1px solid #aaa; 
} 
.tableRowRight1 { 
    padding: 5px; 
    background-color: #f7f7f7; 
    border-top: 1px solid #fff; 
    border-left: 1px solid #fff; 
    border-bottom: 1px solid #aaa; 
    border-right: 1px solid #aaa; 
} 
.tableRowLeft2 { 
    font-weight: bold; 
    background-color: #ffffff; 
    padding: 5px; 
    border-top: 1px solid #eee; 
    border-left: 1px solid #eee; 
    border-bottom: 1px solid #aaa; 
    border-right: 1px solid #aaa; 
} 
.tableRowRight2 { 
    padding: 5px; 
    background-color: #ffffff; 
    border-top: 1px solid #eee; 
    border-left: 1px solid #eee; 
    border-bottom: 1px solid #aaa; 
    border-right: 1px solid #aaa; 
} 
.tableSubmitCell { 
    background-color: #EEEEEE; 
    padding: 5px; 
    border-top: 2px solid #fff; 
    border-left: 2px solid #fff; 
    border-bottom: 1px solid #aaa; 
    border-right: 1px solid #aaa; 
    text-align: right; 
}

來源

2013-12-13 21:57:28

PHP/HTML - 表格寬度

回答

相關問題