在CSS中，我們可以使用百分比（%）來定義元素的寬度，使其相對于高度，以下是一些示例和解釋，說明如何實(shí)現(xiàn)這一目標(biāo)。

1. 寬度相對于父元素的高度

假設(shè)你有一個父元素，其高度為400px，你希望子元素的寬度相對于父元素的高度為50%。

<div style="height: 400px;">
  <div style="width: 50%; height: 100%;">子元素</div>
</div>

在這個例子中，子元素的寬度設(shè)置為父元素寬度的50%，即200px，高度設(shè)置為100%，即400px。

2. 寬度相對于自身的高度

如果你希望一個元素的寬度相對于其高度為50%，無論其父元素的高度是多少。

<div style="height: 400px; position: relative;">
  <div style="width: 50%; height: 100%; position: absolute; top: 0; left: 0;">子元素</div>
</div>

在這個例子中，子元素的寬度設(shè)置為其自身高度的50%，即200px，高度設(shè)置為100%，即400px，通過使用position: absolute;，子元素可以相對于***近的定位祖先（在這個例子中是父元素）來定位。

3. 寬度相對于視口的高度

如果你希望一個元素的寬度相對于視口的高度為50%。

<div style="height: 400px; position: fixed; top: 0; left: 0;">
  <div style="width: 50%; height: 100%;">子元素</div>
</div>

在這個例子中，子元素的寬度設(shè)置為視口寬度的50%，高度設(shè)置為100%，通過使用position: fixed;，子元素可以固定在視口的某個位置。

在CSS中，使用百分比（%）來定義元素的寬度可以使其相對于高度，你可以根據(jù)需要將寬度相對于父元素、自身或視口的高度設(shè)置為50%，希望這些示例能幫助你理解和應(yīng)用這一技術(shù)。