以左边td为中心的基本html表

时间:2013-04-16 03:30:51

标签: html html-table center tablerow

我有一张桌子,我将尝试用这种方式表示:

-------------------------
| L1 |       R1         | 
------------------------  
| L2 |       R2         |
-------------------------

我的代码如下:

<div data-role="content" id="div1" align="top" style="padding:3 !important;" >  
        <table border="0" align="CENTER" cellspacing="0" width="100%" style="vertical-    align: text-bottom;" >
        <tr>
        <td></td>
        <td>
            <div id="question1" class="question">
                <input type="text" id="question" />
            <Style>
                #question{
                  font:5px;
                  font-family:verdana;
                }
            </style>        
            </div>
        </td></tr><tr>
        <td width="50"><img id="img2" width="40" height="36" style="float:right; margin-top: 0px;" ></td>
        <td style="text-align:center;">
            <div class="ui-grid-b" >
                <div class="ui-block-a"><button id="button1" type="submit" data-theme="b" style="font-size:0.8em;"></button></div>
                <div class="ui-block-b"><button id="button2" type="submit" data-theme="b" style="font-size:0.8em;"></button></div>   
                <div class="ui-block-c"><button id="button3" type="submit" data-theme="b" style="font-size:0.8em;"></button></div>  
            </div>
        </td>
        </tr>
        </table>
</div>

所以基本上我要做的是,我的表中没有L1部分。 R1有数据,因此有R2。 L2中有一个图像。我要做的是删除L1和L2之间的划分,L2中的图像应该以桌面为中心而不仅仅是L2的TD。我该怎么做?

另外我的问题是,在以下代码行中:

<input type="text" id="question" />

当填充值时,当我在移动设备中查看此值时,文本有时会转到下一行。我认为textarea是唯一具有多行的HTML标签。不确定为什么这里的文字是多行的,我该如何避免呢?

1 个答案:

答案 0 :(得分:1)

<table border="0"....

下查看此位
<tr><td></td>

将其更改为

 <tr>
   <td width="50" rowspan="2">
     <img id="img2" width="40" height="36" style="float:right; margin-top: 0px;">
   </td>

然后摆脱最初持有该图像的<td></td>