0

3つの質問があります。1 つはラジオ ボタン オプション付き、もう 1 つはチェックボックス付き、もう 1 つはテキストエリア付きです。私が抱えている問題は、すべての質問が同じ行にある必要があり、それらの各質問の下に選択肢があることです. テーブルを使用して同じ行で質問を取得しましたが、問題は、適切な質問ごとに選択肢 (ラジオ ボタン、チェックボックス、およびテキスト領域) を取得できないことです。

これは私が受け取っているものです：

 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

私はNaderの答えに同意しますが、あなたの質問に答えるために、選択肢が質問の下ではなく、質問の隣に表示される理由は、それらを同じ行内の異なるセルに（を使用して）配置しているためです（この新しい列を作成します)。2 番目の行を作成し、すべての選択肢に対して 1 つのセルを使用する場合は、希望どおりの外観になります。

<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を使用することをお勧めします（個人的には、テーブルが適切な解決策であるとは確信していません）、とはいえ、3つの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 に答える