javascript - 写真のようにテキストボックスの上に名と名前を配置する方法

Question

私はそれを見ましたが、それを行う方法がわかりません..またはこれを達成するためにテキストボックスをラップするために使用されるもの。

フィールドセットでやろうと思っていたのですが、間違っているかもしれません。

私の主張を伝える画像と希望を含めました。

ありがとうございました ..

Answer 1

テーブルなしでこれを行う 1 つの方法を次に示します。

CSS:

<style>
div{
width:150px
}
div label{
clear:left;
font-size:9px;
}
</style>

そしてHTML：

<div><label>First</label><input type="text" id="firstName" /></div>

Answer 2

ここ

<div class="section">
    <div class="left">
        Name
    </div>
    <div class="right">
        <div class="nm">
            First
        </div>
        <div class="val">
            <asp:TextBox runat="server" ID="txtBox1"></asp:TextBox>
        </div>
    </div>
    <div class="right">
        <div class="nm">
            Last
        </div>
        <div class="val">
            <asp:TextBox runat="server" ID="txtBox2"></asp:TextBox>
        </div>
    </div>
</div>

スタイル：

<style>
    .section
    {
        clear: both;
        }
        .section .left
        {
            float: left;
            font-size: 25px;
            padding:5px;
            padding-top:15px;

        }
        .section .right
        {
            float: left;
            padding:5px;

            }
            .section .right .nm
            {
                font-size: 10px;
            }
            .section .right .val
            {
            }
</style>

Answer 3

誰かがおそらくこれのために私を撃つでしょう、しかしテーブルはこれをかなり簡単にすることができます。

<table style="width:375px;" cellspacing="0" cellpadding="2">
    <col width="75px">
    <col width="150px">
    <col width="150px">
    <tr>
        <td></td>
        <td>first</td>
        <td>last</td>
    </tr>
    <tr>
        <td>
            NAME
        </td>
        <td>
            <input type="text" id="firstName" />
        </td>
        <td>
            <input type="text" id="lastName" />
        </td>
    </tr>
</table>

<divs> よろしければ使ってみてください。

編集：カスタムでない限り、これを自動的に実行する.NETコントローラーについてはよく知りません。

Answer 4

これはそれを行う必要があります：

<table>
       <tr>
          <td>
             Name
          </td>
          <td>
             Html.LabelFor(m => m.First)
             Html.TextBoxFor(m => m.First)
          </td>
          <td>
             Html.LabelFor(m => m.Last)
             Html.TextBoxFor(m => m.Last)
          </td>
      </tr>
    </table>