CSS是一種用于網頁設計的樣式表語言，能夠對網頁的布局、字體、顏色、邊框等元素進行樣式設計和控制，能夠讓網頁的外觀更加美觀、簡潔。在用CSS敲網頁時，布局的設計是重中之重，因此，學會如何看布局也尤為重要。

首先，我們需要了解網頁的盒模型，可以將網頁元素看作是一個個矩形盒子，其中包含了內容、內邊距、邊框和外邊距四個部分。在CSS中可以通過設置這四部分的屬性值來調整網頁元素的尺寸、位置和間距。

其次，我們需要通過chrome開發者工具等調試工具來觀察網頁的布局狀況。在工具欄中選擇Elements選項，可以在頁面中看到各個元素的盒模型，包括內容、內邊距、邊框和外邊距四個部分。同時，在Styles中也可以看到每個元素的CSS樣式屬性，我們可以通過更改屬性值來調整網頁的布局。

div {
width: 100px;
height: 100px;
background-color: #F00;
margin: 10px;
padding: 20px;
border: 5px solid #000;
}

上述代碼中，我們定義了一個div元素，并設置了它的寬度、高度、背景顏色、外邊距、內邊距和邊框等屬性。我們可以通過更改這些屬性值來觀察網頁的布局變化。

最后，我們還需要了解CSS布局方案，包括傳統的盒模型布局、彈性盒子布局和網格布局等，這些布局方案可以幫助我們更加輕松、高效地設計網頁布局。

CSS的應用和學習需要不斷的實踐和積累，通過不斷地觀察和調試網頁布局，我們可以更加熟練地運用CSS進行網頁設計，讓網頁更加美觀、簡潔。