在網頁設計中，表單是一個非常重要的元素，可以讓用戶提交數據并與網站互動。而表單的樣式設計，則是網站的重要組成部分。在HTML5中，我們可以使用CSS樣式來實現表單居中的效果。

首先，我們需要在HTML文檔中添加表單代碼，包括form標簽、input標簽等。為了讓表單居中顯示，我們需要對表單的外部容器進行樣式設置。如下面代碼所示：

<div style="text-align:center;">
<form>
<input type="text" name="username" placeholder="用戶名">
<input type="password" name="password" placeholder="密碼">
<button type="submit">登錄</button>
</form>
</div>

在以上代碼中，我們使用了div標簽來作為表單的外部容器，并設置了樣式屬性text-align:center，讓其水平居中顯示。同時，我們也添加了一個簡單的表單，包括用戶名輸入框、密碼輸入框和登錄按鈕。

除了使用CSS樣式設置外部容器的樣式，我們還可以使用CSS flex布局來實現表單的居中。如下面代碼所示：

<div style="display:flex;justify-content:center;">
<form>
<input type="text" name="username" placeholder="用戶名">
<input type="password" name="password" placeholder="密碼">
<button type="submit">登錄</button>
</form>
</div>

在以上代碼中，我們使用了flex布局的屬性display:flex和justify-content:center，讓表單在水平方向上居中顯示。這種方法不僅簡單易懂，還能兼容不同的瀏覽器。

總之，無論是使用CSS樣式設置外部容器的樣式，還是使用CSS flex布局，都能實現表單的居中效果。根據不同的網站設計和構建需求，我們可以靈活地選擇適合的方法，讓表單的樣式更加美觀、簡潔，為用戶提供更好的使用體驗。