0

下午好,

我是 html 新手。我已将 html 表单字段添加到我的应用程序中。文本字段未对齐,它们看起来非常不整洁。这是因为我有像“第一个标签”和“第二个标签”这样的字段名称,它们旁边有一个文本字段。与第一个标签相比,第二个标签的文本字段更靠左。有没有办法在不使用表格的情况下对齐它们?如果我使用桌子,我可以知道我应该怎么做吗?很抱歉,我是新用户,无法上传任何照片。

下面是我的html代码。

感谢您的任何帮助!

干杯,郑红

<div class="rightsettings">
        <form name="addsubject" action="html_form_action.asp" method="get">
        <br>Subject: <input type="text" name="user" /></br>
        <br>Number of tags<select name="addnoofsubject" id = "addnoofsubject" onchange="checktags()">
            <option value=1>1</option>
            <option value=2>2</option>
            <option value=3>3</option>
            <option value=4>4</option>
            <option value=5>5</option>
        </select></br>
        <div id="addfirsttag">
        <br>First Tag: <input type="text" name="tag1"/></br>
        <div id = "addsecondtag" style="visibility:hidden">
        <br>Second Tag: <input type="text" name="tag2"/></br>
        </div>
        <div id = "addthirdtag" style="visibility:hidden">
        <br>Third Tag: <input type="text" name="tag3"/></br>
        </div>
        <div id = "addfourthtag" style="visibility:hidden">
        <br>Fourth Tag: <input type="text" name="tag4"/></br>
        </div>
        <div id = "addfifthtag" style="visibility:hidden">
        <br>Fifth Tag: <input type="text" name="tag5"/></br>
        </div>
        <br><input type="submit" value="Submit" /></br>
        </form>
    </div>
4

3 回答 3

1

我建议您将表格插入表格。

<div class="rightsettings">
    <form name="addsubject" action="html_form_action.asp" method="get">
        <table cellpadding="1" cellspacing="1" border="0">
            <tr><td>Subject:</td><td><input type="text" name="user" /></td></tr>
            <tr><td>Number of tags::</td><td><select name="addnoofsubject" id = "addnoofsubject" onchange="checktags()"> 
                <option value=1>1</option> 
                <option value=2>2</option> 
                <option value=3>3</option> 
                <option value=4>4</option> 
                <option value=5>5</option> 
            </select></td></tr>

            <tr><td>First Tag:</td><td><div id="addfirsttag"><input type="text" name="tag1"/></div></td></tr>
             <!-- all your tags like the one above -->
            <tr><td colspan="2" align="center"><input type="submit" value="Submit" /></td></tr>
        </table>
    </form> 
</div> 
于 2012-08-02T09:10:34.497 回答
1

试试这个

   <table>
    <tr style="visibility:hidden"><td>First tag :><td><input type="text" name="tag1"/></td></tr>
    <tr style="visibility:hidden"><td>Second tag :><td><input type="text" name="tag2"/></td></tr>
    <tr style="visibility:hidden"><td>Third tag :><td><input type="text" name="tag3"/> </td></tr>
   <tr><td colspan="2" align="center"><input type="submit"></td></tr>
    </table>
于 2012-08-02T09:10:47.427 回答
0

有一张桌子

<table>
<tr><td>First Tag</td><td><input ... /></td></tr>
<tr><td>Second Tage</td><td><input ... /></td></tr>
...
</table>

用CSS

CSS部分:

label
{
    display: block;
    width: 150px;
    float: left;
}

html部分:

<label for="tag1">First Tag:</label><input ... /><br />
<label for="tag2">Second Tag:</label><input ... /><br />
于 2012-08-02T09:10:05.650 回答