[分享]css中如何表示宽等于高

CSS中有时候我们需要将某个元素的宽度与高度保持相等，这在一些需要正方形元素的时候很有用。以下是几种方法：/ 方法一/ .square { width: 50; height: 0; paddingb...

CSS中有时候我们需要将某个元素的宽度与高度保持相等，这在一些需要正方形元素的时候很有用。以下是几种方法：

/* 方法一*/
.square {
   width: 50%;
   height: 0;
   padding-bottom: 50%;
}

/* 方法二 */
.square {
   width: 100%;
   height: 100%;
} 

方法一中，我们将元素的高度设置为0，用padding-bottom来撑起元素的高度，其值为50%即可保证元素宽高相等。

方法二中，我们直接将元素的宽度和高度都设置为100%即可实现宽等于高。

以上是两种比较简单的实现方法，如果需要更复杂的样式，可以使用更灵活的CSS布局方式来实现。