HTML 表单，如何垂直对齐和居中输入字段？
我有一个 HTML 表单，输入字段已经居中，但它们没有垂直对齐。
我想让所有标签和输入垂直对齐，以便所有标签都在同一条垂直线上，并且所有输入都在同一条垂直线上。
到目前为止，我所拥有的只是 div 中的字段：
<div class="container" align="center">
#formContainer{
width:40%;
margin:auto;
}
#formC{
width:100%;
}
.rows{
width:100%;
display:block;
}
.column{
width:100%;
display:inline-block;
}
.theLabels{
width:30%
float:left;
}
.theInputs{
width:60%;
float:right;
}<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<div id="formContainer">
<form id="formC">
<div class="rows">
<div class="column">
<label class="theLabels">
URL:
</label>
<input class="theInputs" type="text"/>
</div>
<div class="column">
<label class="theLabels">
Code Base:
</label>
<input class="theInputs" type="text"/>
</div>
<div class="column">
<label class="theLabels">
Email:
</label>
<input class="theInputs" type="email"/>
</div>
</div>
</form>
</div>
</body>
</html>如果您想要一行中的 2 列，您应该将列类中的 width:100% 更改为 width:48% 或创建另一个宽度为 48% 的类。希望能帮助到你
你在使用引导程序吗？
制作一个主 div 并将所有内容放入其中..就像
<div class="container h-100">
<div class="row h-100 justify-content-center align-items-center">
<form class="col-12">
<div class="form-group">
<label for="formGroupExampleInput">Example label</label>
<input type="text" class="form-control" id="formGroupExampleInput" placeholder="Example input">
</div>
<div class="form-group">
<label for="formGroupExampleInput2">Another label</label>
<input type="text" class="form-control" id="formGroupExampleInput2" placeholder="Another input">
</div>
</form>
</div>
</div>