CSS中的高度和寬度是指元素在頁面上占據的空間大小。在CSS中，可以使用固定的像素值來定義元素的高度和寬度。但是，隨著不同屏幕尺寸及設備的出現，固定的像素值可能無法滿足不同的需求。因此，在CSS中使用百分比來定義元素的高度和寬度是一種更加靈活的方法。

使用百分比來控制元素的高度和寬度，可以根據父元素的尺寸來自適應地縮放。例如，假設有一個div容器元素，它的寬度為800像素，如果我們將其中一個子元素的寬度設置為50%，那么這個子元素的寬度將會自動適應為400像素。

.parent{
width: 800px;
height: 400px;
background-color: #ccc;
}
.child{
width: 50%;
height: 50%;
background-color: red;
}

在上面的代碼中，我們將父元素的寬度設置為800像素，高度設置為400像素，然后將子元素的寬度和高度都設置為50%。這樣，子元素的寬度和高度將自動適應為父元素的一半，并且在不同屏幕尺寸下，子元素的大小也會自適應地變化。

需要注意的是，使用百分比來控制元素的高度和寬度，需要先確定其父元素的尺寸。如果父元素的尺寸無法確定，那么百分比設置可能會失效。

在實際開發中，百分比可以用來控制圖片、文本框、按鈕等元素的大小。另外，還可以使用CSS的媒體查詢來針對不同的屏幕尺寸設置不同的百分比大小，以達到最佳的可用性和用戶體驗。