HTML是現(xiàn)在互聯(lián)網(wǎng)最為常用的標記語言，網(wǎng)頁的制作離不開HTML，HTML中除了可以設置文字、圖片等內(nèi)容外，還可以設置長方框。而要為長方框添加樣式，就需要使用CSS。下面我們就來探討如何使用CSS樣式設置長方框。

/* 設置長方框的樣式 */
.box {
width: 200px;  /* 設置寬度 */
height: 100px; /* 設置高度 */
margin: 20px;  /* 設置外邊距 */
padding: 20px; /* 設置內(nèi)邊距 */
border: 1px solid #000; /* 設置邊框 */
background-color: #f5f5f5; /* 設置背景顏色 */
}
/* 在CSS中使用類名.box來設置長方框的樣式 */

上面的代碼中，.box是CSS中的類名，可以為長方框指定樣式。通過設置width、height、margin、padding、border等屬性，可以自定義長方框的大小、外邊距、內(nèi)邊距、邊框等屬性。同時，也可以為長方框設置背景顏色、邊框顏色等屬性，讓長方框更加美觀。

在HTML中，我們可以使用div標簽來定義長方框。首先，創(chuàng)建一個div元素，并給它一個類名為box，然后在CSS中設置.box的樣式，即可為長方框添加樣式。下面是HTML代碼示例：

<div class="box">
<p>這是一個長方框</p>
</div>

通過以上HTML代碼和CSS樣式，我們可以看到一個帶有邊框和背景色的長方框。當然，我們也可以在CSS中添加更多的樣式，以讓長方框更加美觀。這里提供一個更多樣式的CSS代碼示例：

.box {
width: 200px;
height: 100px;
margin: 20px;
padding: 20px;
border: 2px solid #ddd;
background-color: #fcfcfc;
box-shadow: 1px 1px 6px rgba(0,0,0,.1);
border-radius: 6px;
font-size: 16px;
color: #333;
text-align: center;
line-height: 100px;
}

通過以上的CSS代碼，可以為長方框添加更多的樣式，例如陰影、圓角等，讓長方框更加美觀。在HTML中，只需要添加class="box"即可應用以上的CSS樣式。