在Web開發(fā)中，表單是不可或缺的一個部分，而將多個表單并排排列在一起則能使頁面看起來更加整齊、美觀。CSS的應(yīng)用能讓表單布局更加靈活、多樣化。

下面是一段使用CSS布局的表單代碼，其中包括兩個輸入框和一個提交按鈕，并排排列在一起。

<div class="form-wrapper">
<form class="form">
<input type="text" name="username" placeholder="請輸入用戶名">
<input type="password" name="password" placeholder="請輸入密碼">
<button type="submit">提交</button>
</form>
</div>

使用CSS代碼如下：

.form-wrapper {
display: flex; /* 使用Flex布局 */
align-items: center; /* 將元素垂直居中 */
justify-content: center; /* 將元素水平居中 */
}
.form {
display: flex; /* 將form內(nèi)部的元素使用Flex布局 */
}
input, button {
margin-right: 10px; /* 給元素之間添加一個10px的距離 */
}

在這段CSS代碼中，我們使用了Flex布局來控制每個表單元素的位置。其中，.form-wrapper類設(shè)置為Flex容器，其內(nèi)部的.form類的元素同樣采用Flex布局。通過將屬性display設(shè)為flex，可以啟用CSS的Flex布局模式。

對于每個表單元素的樣式，我們使用了margin-right屬性使它們之間保持一定的距離。這里設(shè)置為10px。

此外，我們還可以添加其他的屬性來控制表單的樣式，比如設(shè)置表單的寬度、背景顏色等等。總的來說，使用CSS布局能夠讓表單更加靈活、美觀，從而提高用戶的體驗。