0

我必须有 3 个问题。一种带有单选按钮选项，一种带有复选框，一种带有文本区域。我遇到的问题是所有问题都必须与每个问题下方的选择保持一致。我使用表格将问题放在同一行，但我遇到的问题是我无法在每个适当的问题下获得选择（单选按钮、复选框和文本区域）。

这是我收到的：

 Your question here: choice 1 choice 2. ques. here: c1, c2, c3, c4

我需要这个：

Your question here:       
Choice 1                                        
Choice 2

以该格式在该问题旁边的其他 2 个问题。

这是我在下面使用的 html 编码：

<table>
<tr>
    <td align="left">  Your question here:</td>     
    <td><input name="choice" type="radio" value="1" />Choice 1 </td>
    <br />
    <td><input name="choice" type="radio" value="2" checked="checked" />Choice 2</td>

    <td align="center"> Your question here:</td>
<br>
    <td><input name="choice" type="checkbox" value="choice1" />Choice 1</td>
<br>    
    <td><input name="choice" type="checkbox" value="choice2" />Choice 2</td>
<br>    
    <td><input name="choice" type="checkbox" value="choice3" />Choice 3</td>
<br>        
    <td><input name="choice" type="checkbox" value="choice4" checked="checked">Choice 4</td>

<td align="right"> Your question here:</td>
<td><br /><textarea name="other" rows="5" cols="35"></textarea></td> 


</tr>
</table>

我尝试使用每个选项，但它直接在彼此下方显示问题和答案，这不是我需要的。这让我发疯，因为我知道这很简单。有人知道如何解决这个问题吗？

4

3 回答 3

2

我同意纳德的回答，但要回答您的问题，选择出现在问题旁边而不是在问题下方出现的原因是因为您将它们放置在同一行内的不同单元格中（使用）（这创建一个新列）。如果您要制作第二行并为所有选择设置一个单元格，它看起来更像您想要的。

<table>
<tr>
    <td align="left" style="width:200px;">  Your question here:</td>  
    <td align="center" style="width:200px;"> Your question here:</td>  
    <td align="right" style="width:200px;"> Your question here:</td>
</tr>
<tr>
    <td align="left">
       <input name="choice" type="radio" value="1" />Choice 1 <br />
       <input name="choice" type="radio" value="2" checked="checked" />Choice 2</td>

    <td align="center">
       <input name="choice" type="checkbox" value="choice1" />Choice 1 <br /> 
       <input name="choice" type="checkbox" value="choice2" />Choice 2 <br/> 
       <input name="choice" type="checkbox" value="choice3" />Choice 3 <br />
       <input name="choice" type="checkbox" value="choice4" checked="checked" />Choice     4
    </td>

   <td><br /><textarea name="other" rows="5" cols="30"></textarea></td> 
</tr>
</table>

我添加了一些样式，使其看起来更加间隔。绘制表格的边界以查看事物的间距会很有用。

于 2013-03-03T20:50:40.033 回答
0

好吧，我绝对建议您使用 div 而不是表格（我个人不相信表格是合适的解决方案），话虽如此，有三个 div，全部向左浮动，每个宽度为 33%，然后发布问题以及其中的答案。例如

<div>
Question 1<br/>
Choice 1 
Choice 2 
Choice 3
</div>

<div>
Question 2<br/>
Choice 1 
Choice 2 
Choice 3
</div>

<div>
Question 3<br/>
Choice 1 
Choice 2 
Choice 3
</div>

<style>
div{
    width:33%;
    float:left;
}
</style>
于 2013-03-03T20:26:04.697 回答
0

用你的桌子作为解决方案，我认为你需要这个......

<table>
<tr>
        <td >  Your question here:</td>
        <br />  
        <td > Your question here:</td>
        <br />  
        <td > Your question here:</td>
</tr>

<tr>
    <td>
        <input name="choice" type="radio" value="1" />Choice 1 
        <br />  
        <input name="choice" type="radio" value="2" checked="checked" />Choice 2
    </td>
    <td>
        <input name="choice" type="checkbox" value="choice1" />Choice 1
        <br />  
        <input name="choice" type="checkbox" value="choice2" />Choice 2
        <br />  
        <input name="choice" type="checkbox" value="choice3" />Choice 3
        <br />      
        <input name="choice" type="checkbox" value="choice4" checked="checked" />Choice 4
    </td>   
    <td>
        <textarea name="other" rows="5" cols="25"></textarea> 
    </td>
</tr>

</table>
于 2013-03-03T20:44:01.677 回答