現在，網站注冊和登錄已成為許多網站的標準功能之一。為了使用戶能夠更方便地完成注冊過程，優雅而簡單的CSS樣式是必須的。下面將介紹如何為網站的注冊表單添加CSS樣式，滿足用戶的高標準需求。

/* 局部初始化 */
* {
margin: 0;
padding: 0;
font-family: '微軟雅黑';
box-sizing: border-box;
outline: none;
}
/* 注冊框整體樣式 */
.register {
width: 100%;
height: 100%;
display: flex;
justify-content: center;
align-items: center;
background-color: #fff;
}
.register form {
width: 400px;
border: 1px solid #e6e6e6;
border-radius: 4px;
padding: 30px;
}
/* 標題和輸入框樣式 */
.title {
font-size: 24px;
font-weight: bold;
text-align: center;
margin-bottom: 20px;
}
.input-group {
margin-bottom: 20px;
}
.input-group input {
width: 100%;
height: 36px;
padding: 0 10px;
border: 1px solid #e6e6e6;
border-radius: 4px;
font-size: 14px;
}
.input-group label {
display: block;
font-size: 14px;
margin-bottom: 10px;
}
/* 按鈕樣式 */
.btn {
width: 100%;
height: 36px;
border: none;
border-radius: 4px;
background-color: #009688;
color: #fff;
font-size: 14px;
cursor: pointer;
transition: all 0.3s;
}
.btn:hover {
background-color: #008e80;
}

這段CSS代碼展現了一個簡單的注冊表單，如您所見，這個表單擁有圓角邊框和內部填充，這使得用戶界面更加友好。我們使用display: flex;來使表單水平居中，成為頁面的焦點。在表單中，我們還定義了標題和輸入框樣式，以及提交按鈕的樣式。這是為了幫助用戶更好地識別表單的內容和交互，并提高交互的魅力。