希望对齐此表单，使其看起来更统一。对齐方式到处都是，更改 col # 似乎不起作用。请帮忙！
<form>
<br>
<div class="row col-6 mx-auto">
<div class="form-group col-md-4">
<input type="text" class="form-control" placeholder="First name">
</div>
<div class="form-group col-md-4">
<input type="text" class="form-control" placeholder="Last name">
</div>
</div>
<div class="row col-6 mx-auto">
<div class="form-group col-md-4">
<input type="email" class="form-control" id="inputEmail4" placeholder="Email">
</div>
<div class="form-group col-md-4">
<input type="password" class="form-control" id="inputPassword4" placeholder="Password">
</div>
</div>
<div class=" row">
<div class=" form-group col-3 mx-auto">
<input type="text" class="form-control" id="inputAddress" placeholder="Address 1">
</div>
</div>
<div class="form-group col-md-4 mx-auto">
<input type="text" class="form-control" id="inputAddress2"
placeholder="Apartment, studio, or floor">
</div>
<div class="form-row col-6 mx-auto">
<div class="form-group col-md-3">
<input type="text" class="form-control" id="inputCity" placeholder="City">
</div>
<div class="form-group col-md-2">
<select id="inputState" class="form-control">
<option selected>State...</option>
<option>...</option>
</select>
</div>
<div class="form-group col-md-3">
<input type="text" class="form-control" id="inputZip" placeholder="Zip">
</div>
</div>
<button type="submit" class="btn btn-primary btn-lg">Sign Up For SoftDev</button>
<br> Have an Account? <a href="/hompage.html/#loginEmail"> Sign in</a>
</form>我的代码外观的视觉图像
将所有内容嵌套在与顶部相同的类下(这些类似乎可以按预期工作(
下面的代码片段：
<!DOCTYPE html>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.min.js"></script>
<div class="container">
<form>
<br>
<div class="row col-6 mx-auto">
<div class="form-group col-md-6">
<input type="text" class="form-control" placeholder="First name">
</div>
<div class="form-group col-md-6">
<input type="text" class="form-control" placeholder="Last name">
</div>
</div>
<div class="row col-6 mx-auto">
<div class="form-group col-md-6">
<input type="email" class="form-control" id="inputEmail4" placeholder="Email">
</div>
<div class="form-group col-md-6">
<input type="password" class="form-control" id="inputPassword4" placeholder="Password">
</div>
</div>
<div class=" row col-6 mx-auto">
<div class=" form-group col-12 mx-auto">
<input type="text" class="form-control" id="inputAddress" placeholder="Address 1">
</div>
</div>
<div class=" row col-6 mx-auto">
<div class="form-group col-md-12 mx-auto">
<input type="text" class="form-control" id="inputAddress2" placeholder="Apartment, studio, or floor">
</div>
</div>
<div class="row col-6 mx-auto">
<div class="form-group col-md-5">
<input type="text" class="form-control" id="inputCity" placeholder="City">
</div>
<div class="form-group col-md-3">
<select id="inputState" class="form-control">
<option selected>State...</option>
<option>...</option>
</select>
</div>
<div class="form-group col-md-4">
<input type="text" class="form-control" id="inputZip" placeholder="Zip">
</div>
</div>
<div class="row col-6 mx-auto">
<div class="form-group col-md-6 mx-auto">
<button type="submit" class="btn btn-primary btn-lg">Sign Up For SoftDev</button>
</div>
</div>
<br> Have an Account? <a href="/hompage.html/#loginEmail"> Sign in</a>
</form>
</div>