CSS 令高等于寬

CSS 是一種用于網頁布局的語言，可以讓我們對網頁的各個方面進行樣式的調整，包括布局、字體、顏色等等。在 CSS 中，我們可以通過設置容器元素的寬高，來使元素的內容居中，并且使其高度等于寬度。

讓我們以一個簡單的例子來說明如何實現這一目標。假設我們有一個容器元素，其寬度為 100 像素，高度為 50 像素，我們想要使元素的內容居中，并且使其高度等于寬度。

首先，在 CSS 中，我們可以使用以下代碼來設置容器元素的寬高：

```css

.container {

width: 100px;

height: 50px;

這樣，我們設置容器元素的寬高為 100 像素和 50 像素。接下來，我們可以使用以下代碼來使元素的內容居中：

```css

.container {

display: flex;

justify-content: center;

align-items: center;

這樣，我們使用 CSS 的 `flex` 屬性來將容器元素轉換為一個 Flexbox 容器，并使用 `justify-content`、`align-items` 屬性來使元素的內容居中。

現在，讓我們看看元素的高度是否等于寬度：

```html

<div class="container">

<div class="content">居中的內容</div>

</div>

在瀏覽器中打開這個網頁，我們可以看到元素的內容已經被居中了，并且其高度等于寬度。

通過使用 CSS 的 `flex` 屬性，我們可以輕松地使元素的高度等于寬度。這種方法不僅可以用于居中元素的內容，還可以用于使其他元素在水平或垂直方向上居中，以及使容器元素具有多種樣式。