Question

我目前有一个看起来像这样的表：

http://i.imgur.com/m7vrXyj.png

我想将两个文本框TD移动到它左边的TD旁边（如上图所示）。

我已经尝试过诸如min-width和white-space: nowrap之类的内容，但是，一切都没有奏效。我该如何解决这个问题？或者这是不可能的？

表的代码是：

<table>
    <tr>
        <td>Name</td>
        <td>
            <input type="text" name="user" placeholder="Your Name" maxlength="20">
        </td>
    </tr>
    <tr>
        <td>Email Address</td>
        <td>
            <input type="text" name="email" placeholder="Your Email Address">
        </td>
    </tr>
    <tr><td>Message</td></tr>
    <tr>
        <td>
            <textarea rows="10" cols="50" name="message" maxlength="500"></textarea>
        </td>
    </tr>
</table>

Answer 1

您正在寻找TD和TR的colspan属性。它定义了应将多少列分组为一列。

<table>
    <tr>
        <td>Name</td>
        <td>
            <input type="text" name="user" placeholder="Your Name" maxlength="20">
        </td>
    </tr>
    <tr>
        <td>Email Address</td>
        <td>
            <input type="text" name="email" placeholder="Your Email Address">
        </td>
    </tr>
    <tr><td>Message</td></tr>
    <tr>
        <td colspan="2">
            <textarea rows="10" cols="50" name="message"></textarea>
        </td>
    </tr>
</table>

以上是关于jsfiddle的上述示例：http://jsfiddle.net/5Nc6x/

更改HTML表格中的TD大小

1 个答案: