今天我們將學習如何使用HTML和CSS來創建一個仿登陸頁面。這個頁面將包括一個用戶名輸入框和一個密碼輸入框，以及一個登錄按鈕來提交表單。 首先讓我們來看看HTML代碼。我們需要創建一個表單元素，包含一個輸入文本框用于輸入用戶名，以及一個密碼框用于輸入密碼。還需要創建一個登錄按鈕，以便用戶提交表單。

<form>
<p>
<label>用戶名:</label>
<input type="text" name="username" />
</p>
<p>
<label>密碼:</label>
<input type="password" name="password" />
</p>
<p>
<input type="submit" value="登錄" />
</p>
</form>

接下來，我們需要使用CSS來樣式化我們的表單，使它看起來真正像一個登錄框。我們將使用盒模型和flexbox布局來實現。

<style>
form {
background-color: #fff;
border-radius: 5px;
box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1);
padding: 20px;
width: 300px;
margin: 0 auto;
}
p {
margin: 0;
}
label {
display: block;
font-size: 14px;
margin-bottom: 10px;
color: #333;
}
input[type="text"],
input[type="password"] {
border: 1px solid #ccc;
border-radius: 3px;
font-size: 14px;
padding: 8px;
margin-bottom: 15px;
width: 100%;
}
input[type="submit"] {
background-color: #4CAF50;
border: none;
color: #fff;
cursor: pointer;
font-size: 16px;
font-weight: bold;
padding: 10px;
width: 100%;
}
</style>

這樣，我們就創建了一個漂亮的登錄頁面，它看起來像這樣：  希望這篇文章可以對你有所幫助！