CSS 格子輸入框是一種常見的表單樣式，它可以將表單元素排列在網格狀的布局中，使表單看起來有條理性。如果你想在你的網站中添加這種樣式，下面是一個示例：

<!-- HTML 代碼 -->
<div class="grid-container">
<div class="grid-item">
<label for="name">姓名</label>
<input type="text" id="name" name="name">
</div>
<div class="grid-item">
<label for="email">電子郵件</label>
<input type="email" id="email" name="email">
</div>
<div class="grid-item">
<label for="password">密碼</label>
<input type="password" id="password" name="password">
</div>
<div class="grid-item">
<label for="phone">電話</label>
<input type="tel" id="phone" name="phone">
</div>
</div>
<!-- CSS 代碼 -->
.grid-container {
display: grid;
grid-template-columns: repeat(2, 1fr);
grid-gap: 10px;
}
.grid-item {
display: flex;
flex-direction: column;
}
label {
margin-bottom: 5px;
}
input {
padding: 5px;
border-radius: 5px;
border: 1px solid #ccc;
}

在這個示例中，我們使用了 CSS 網格布局來創建一個 2 列的網格布局，其中 .grid-item 元素包含一個 label 和一個 input。此外，我們還使用了 flexbox 布局和一些基本的樣式來美化這個表單。

總的來說，CSS 格子輸入框是一種靈活且易于使用的表單樣式，它可以幫助你在網站上創建組織良好的表單，提高用戶體驗。