Question

尝试获取html的输入字段以与其他输入字段对齐。

有没有办法让它在不使用CSS的情况下对齐？

这就是我所拥有的：名称：| -----输入------- |

密码：| ----- -------输入|

确认密码：| -----输入------- |

电子邮件：| ----- -------输入|

电话：| ----- -------输入|

尝试这样做：

名称：..................... | ----- -------输入|

密码：.............. | ----- -------输入|

确认密码：| -----输入------- |

电子邮件：..................... | ----- -------输入|

电话：................... | ----- -------输入|

（没有点）

代码：

<form>
    <label>Name:</label>
    <input type="text" name="namefield" align="center"> <br /> 
    <label><br>Password: </label>
    <input type="password" name="pwdfield"> <br /> 
    <label><br>Confirm password: </label>
    <input type="password" name="cpwdfield"> <br />
    <label><br>Email: </label>
    <input type="email" name="email"> <br /> 
    <label><br>Phone: </label> 
    <input type="tel" name="phone"> <br />
    <br>
    <input type="submit" value="Register" />
</form>

Answer 1

你可以使用div或label。我打算用标签给你看。

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
 <HEAD>
  <TITLE>TableLess Form</TITLE>
  <META name="Author" Content="Bit Repository">

  <META name="Keywords" Content="form, divs">
  <META name="Description" Content="A CSS Tableless Form Design">

<link rel="stylesheet" type="text/css" href="style.css" />

</HEAD>

 <BODY>

<center>

<div align="left" style="width: 500px;">

<form name="register" method="post" action="">
<fieldset><legend>Member Registration</legend>

<label>Username</label><input type="text" name="name"><br />

<label>E-Mail</label><input type="text" name="email"><br />

<label>Password</label><input type="password" name="password"><br />

<label>Confirm password</label><input type="password" name="confirm_password"><br />

<label>Comments (optional)</label><textarea name="message" rows="5" cols="25"></textarea><br />

<label>&nbsp;</label><input type="checkbox" name="i_agree" value="1">I agree to the terms & conditions<br />

<label>&nbsp;</label><input type="submit" name="submit" value="Send Message"><br />

</center>

</fieldset>

</form>

</div>

 </BODY>
</HTML>

<强>的style.css

HTML, BODY
{
padding: 0;
border: 0px none;
}

/* Let's add some style to our fieldset & legend */

fieldset
{
-moz-border-radius: 7px;
border: 1px #dddddd solid;
padding: 10px;
width: 550px;
margin-top: 10px;
}

fieldset legend
{
border: 1px #1a6f93 solid;
color: black;

font-family: Verdana;
font-weight: none;
font-size: 13px;

padding-right: 5px;
padding-left: 5px;
padding-top: 2px;
padding-bottom: 2px;

-moz-border-radius: 3px;
}

/* Label */
label
{
width: 140px;
padding-left: 20px;
margin: 5px;
float: left;
text-align: left;
}

/* Input, Textarea */
input, textarea
{
margin: 5px;
padding: 0px;
float: left;
}

/* BR */

br
{
clear: left;
}

我希望这会对你有所帮助。

在没有CSS的情况下对齐HTML中的输入字段

1 个答案: