在進行網頁布局時，我們必須了解如何取div的寬度和高度，這是CSS中的一個重要概念。 要取div的寬度和高度，我們可以使用CSS的width和height屬性。width屬性用于設置div的寬度，height屬性用于設置div的高度。 例如，我們可以通過以下CSS代碼設置一個寬度為200像素，高度為100像素的div：

div {
width: 200px;
height: 100px;
}

如果我們想要取得div的實際寬度和高度，可以使用JavaScript編寫以下代碼：

let div = document.querySelector('div');
let width = div.offsetWidth;
let height = div.offsetHeight;
console.log(`div 的寬度為: ${width}px，高度為: ${height}px`);

在這個代碼中，我們使用querySelector方法選擇了一個div元素，并使用offsetWidth和offsetHeight屬性來獲得它的實際寬度和高度。最后，我們使用console.log方法來輸出這些值。 除了使用JavaScript來取得div的寬度和高度外，還可以通過CSS的calc函數來實現。例如，以下代碼可以將一個div寬度設置為屏幕寬度的一半，并將高度設置為寬度的一半：

div {
width: calc(50% - 50px);
height: calc((50% - 50px) / 2);
}

在這個代碼中，我們使用calc函數將50%和50像素相減來設置寬度。我們還使用相同的計算方法來設置高度，但將其除以2以使其成為寬度的一半。 總的來說，取得div的寬度和高度是CSS中的一個重要概念。我們可以使用CSS的width和height屬性、JavaScript和calc函數來實現。了解如何取得div的寬度和高度可以幫助我們更好地進行網頁布局。