表格布局结构

时间:2016-06-07 15:48:12

标签: html css

我希望我的表格布局如下:

enter image description here

此时我的桌子看起来像这样:

enter image description here

Carrinho de compras ”按钮必须低于一切。

我尝试更改<th></th>之类的内容imagem,但它不起作用,它保留在nome的左侧。

表格代码:

<table border="1" cellspacing="1px" cellpadding="4px" style="display: inline-block; ">
<tbody>
<tr>
    <?php echo '<img STYLE="width="150" height="150";" src="data:image/jpg;base64,'.base64_encode($row['imagem']).'"/>';?>
</tr>
<th>
    <?php echo $row['nome']; ?>
</th>
<tr class="record">
    <td>REF:</td>
    <td><?php echo $row['ref']; ?></td>
    <td>Preço:</td>
    <td><?php echo $row['preco']; ?></td>
    <tr><form method="post" action="https://www.paypal.com/cgi-bin/webscr" target="paypal">
            <input type="hidden" name="cmd" value="_cart">
            <input type="hidden" name="add" value="1">
            <input type="hidden" name="business" value="">

            <input type="hidden" name="item_name" value="<?php echo $row['nome']; ?>">
            <input type="hidden" name="quantity" value="1">
            <input type="hidden" name="amount" value="<?php echo $row['preco']; ?>">

            <input type="image" src="https://www.paypalobjects.com/pt_PT/PT/i/btn/btn_cart_SM.gif" border="0" name="submit" alt="PayPal - A forma mais fácil e segura de efetuar pagamentos online!">
            <img alt="" border="0" src="https://www.paypalobjects.com/pt_PT/i/scr/pixel.gif" width="1" height="1">
        </form>
    </tr>
</tr>
</tbody>
</table>

CSS代码:

        #tb {
        width: 100px;
        border-collapse: collapse;
        margin-top: -400px;
        margin-left: 260px;
        text-align: left;
        padding: 1em;
        border: 1px solid black;
        background-color:blue;
    }   

    th {
        border-collapse: collapse;
        text-align: left;
        border: 0;
    }

不要担心边框和颜色,我只想完成结构。

1 个答案:

答案 0 :(得分:0)

完成了:

<table border="1" cellspacing="1px" cellpadding="4px" style="display: inline-block; ">
<tbody>
<th  colspan="4">
    <img height="300" width="300" src="data:image/jpg;base64,<?php echo $row['imagem']; ?>" />
</th>
<tr>
    <td colspan="4">
        <?php echo $row['nome']; ?>
    </td>
</tr>
<tr class="record">
    <td>REF:</td>
    <td><?php echo $row['ref']; ?></td>
    <td>Preço:</td>
    <td><?php echo $row['preco']; ?></td>