css中表单对齐 |css的对齐基线

css button 间距，css 清除hover事件，CSS模板素材教程视频，进度条 css圆角，css消除父级标签样式，css里面大于符号怎么使用，css的对齐基线 css中表单对齐 |css的对齐基线

<form>
<div>
<label for="username">用户名：</label>
<input type="text" id="username" name="username">
</div>
<div>
<label for="password">密码：</label>
<input type="password" id="password" name="password">
</div>
<div>
<input type="submit" value="登录">
<input type="reset" value="重置">
</div>
</form>

让表单居中显示

form {
width: 500px;
margin: 0 auto;
}

调整表单项的宽度

label {
float: left;
width: 60px;
text-align: right;
}
input {
float: left;
width: 200px;
}

调整表单项的垂直对齐方式

div {
margin-bottom: 10px;
}
label {
line-height: 30px;
}
input {
height: 30px;
}

以上是针对基本表单的对齐，如需具体调整可以根据上面的示例代码进行调整。通过CSS的灵活运用，可以让表单更漂亮，更易用。