今天我們來講一下如何使用CSS設(shè)置一個(gè)容器里面的控件樣式。 首先，我們需要有一個(gè) HTML 容器，比如一個(gè) div 標(biāo)簽：

<div class="container">
	<input type="text" placeholder="請輸入用戶名">
	<input type="password" placeholder="請輸入密碼">
</div>

現(xiàn)在，我們想要改變里面的控件的樣式，那么就需要使用 CSS 文件來控制。 我們可以給這個(gè)容器添加一個(gè) class 屬性，并在 CSS 文件中定義這個(gè) class 的樣式：

.container {
	background-color: #f2f2f2;
	padding: 10px;
	border: 1px solid #ccc;
}

上面的代碼將這個(gè)容器的背景色設(shè)置為淺灰色，內(nèi)邊距為 10px，邊框?yàn)?1px 實(shí)線灰色。 接下來，我們要修改里面的控件的樣式。同樣，在 CSS 文件中定義相應(yīng)的樣式即可：

.container input[type="text"],
.container input[type="password"] {
	width: 100%;
	padding: 8px 16px;
	margin: 8px 0;
	display: inline-block;
	border: 1px solid #ccc;
	border-radius: 4px;
	box-sizing: border-box;
	font-size: 16px;
}

上面的代碼將所有的文本輸入框和密碼輸入框的樣式進(jìn)行了統(tǒng)一的修改，包括寬度、內(nèi)邊距、邊距、邊框、圓角、盒子模型以及字體大小等等。 最后，我們再看一下修改后的 HTML 代碼：

<div class="container">
	<input type="text" placeholder="請輸入用戶名">
	<input type="password" placeholder="請輸入密碼">
</div>

這樣，我們就成功地使用 CSS 設(shè)置了容器里面的控件的樣式。希望大家都能學(xué)會！