CSS（Cascading Style Sheets）是一種用于網頁設計的樣式表語言，通過CSS，我們可以改變網站的外觀和布局。下面讓我們來看看如何使用CSS代碼制作一個簡單的登錄界面。

/*樣式表*/
body{background:#f1f1f1;font-family:Helvetica, Arial, sans-serif; margin:0;}
.form{
width: 400px;
margin: 50px auto;
background: #fff;
padding: 20px 30px;
box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1);
border-radius: 10px;
}
.form h1{
font-size: 30px;
color: #333;
text-align: center;
}
.form input[type="text"],
.form input[type="password"]{
font-family: Helvetica, Arial, sans-serif;
font-size: 16px;
margin-top: 20px;
display: block;
width: 100%;
height: 45px;
padding: 5px 10px;
border: none;
border-bottom: 1px solid #ebebeb;
}
.form button[type="submit"]{
font-family: 'Montserrat', sans-serif;
text-transform: uppercase;
font-size: 16px;
letter-spacing: 2px;
font-weight: bold;
color: #fff;
background: #4CAF50;
width: 100%;
height: 50px;
border: none;
border-radius: 25px;
cursor: pointer;
transition: all 0.5s ease;
margin-top: 20px;
}
.form button[type="submit"]:hover{
background: #43A047;
}

上述代碼定義了一個名為“form”的類，它包含了一個標題（h1）和輸入框（input），還有一個提交按鈕（button）。在類定義中，我們定義了類的寬度（width）、margin外觀、背景色、陰影效果等等。輸入框和按鈕也有很多定義，包括字體、大小、邊框等等。

通過將這些CSS代碼與HTML代碼結合使用，我們可以輕松地制作一個簡單的登錄界面，讓用戶更加舒適地使用我們的網站。