HTML 動態設置寬度 在 HTML 中我們可以使用 CSS 來定義元素的寬度，例如：

p {
width: 500px;
}

這樣將會使所有的<p>元素的寬度為 500 像素。但是，當我們需要動態地設置元素的寬度時，該怎么辦呢？ 這種情況下，我們可以使用 JavaScript 來改變元素樣式。舉個例子，我們要使用 JavaScript 設置某個<p>元素的寬度為屏幕寬度的一半：

p {
width: 50%;
}

現在我們來看一下 JavaScript 代碼：

const paragraph = document.querySelector('p');
const width = window.innerWidth;
paragraph.style.width = width / 2 + 'px';

首先，我們使用querySelector()方法獲取了第一個<p>元素。然后，我們使用window.innerWidth屬性獲取了屏幕的寬度。 最后，我們使用style.width來設置元素的寬度，帶上像素單位。這樣就能動態設置<p>元素的寬度為屏幕寬度的一半了。 這只是一個簡單的例子，JavaScript 可以做更多的事情來動態設置元素樣式。不過，我們要記住盡量避免頻繁地改變元素樣式，因為這會影響頁面性能。