CSS的div容器是一種非常實用的元素，特別是在網頁設計和網頁布局中非常常見。其中最常用的是登錄輸入框的設計。下面我們就來了解一下如何使用CSS來設計登錄輸入框。

/*設置CSS樣式*/
.login{
width: 300px; /*寬度*/
height: 200px; /*高度*/
border: 1px solid #ccc; /*邊框*/
margin: 50px auto; /*居中*/
text-align: center; /*文本對齊方式*/
padding: 20px; /*內邊距*/
}
.login input{
width: 200px; /*寬度*/
height: 25px; /*高度*/
margin-top: 10px; /*間距*/
padding: 5px; /*內邊距*/
font-size: 16px; /*字體大小*/
border: 1px solid #ccc; /*邊框*/
border-radius: 5px; /*圓角*/
}
.login button{
width: 220px; /*寬度*/
height: 30px; /*高度*/
margin-top: 20px; /*間距*/
background-color: #00bfff; /*背景色*/
color: #fff; /*字體顏色*/
font-size: 16px; /*字體大小*/
border: none; /*無邊框*/
border-radius: 5px; /*圓角*/
}

以上代碼中，我們設置了一個類名為“login”的div容器，該容器設置了寬度、高度、邊框、內邊距、文本對齊方式等屬性。其中的輸入框和按鈕都包含在該容器中，分別設置了寬度、高度、邊框、內邊距、字體大小、圓角等屬性。最后的登錄按鈕使用了背景色和字體顏色，以顯示出較好的視覺效果。

通過以上的CSS設置，我們就可以得到一個簡單但美觀實用的登錄輸入框。希望本文對愛好CSS設計和網頁制作的朋友有所幫助！