如何将一个元素的高度设置为等于另一个元素？(包含Codepen)

要将一个元素的高度设置为等于另一个元素，可以使用CSS的属性和JavaScript来实现。下面是一种常见的方法：

1. 使用CSS的属性：可以使用CSS的height属性将一个元素的高度设置为另一个元素的高度。首先，给需要设置高度的元素添加一个类名或者ID，例如element1和element2。然后，在CSS中使用height属性将element2的高度设置为element1的高度。

#element2 {
  height: 100%;
}

1. 使用JavaScript：如果需要动态地将一个元素的高度设置为另一个元素的高度，可以使用JavaScript来实现。首先，获取需要设置高度的两个元素的引用，可以使用document.getElementById()或其他选择器方法。然后，使用JavaScript获取第一个元素的高度，并将其应用到第二个元素。

var element1 = document.getElementById('element1');
var element2 = document.getElementById('element2');

element2.style.height = element1.offsetHeight + 'px';

这样，element2的高度就会被设置为与element1相同的高度。

如果你想查看这个方法的实际效果，可以使用CodePen来尝试。在CodePen中，你可以创建一个HTML文件，然后在HTML、CSS和JavaScript编辑器中分别添加上述代码。这样你就可以实时查看效果了。

这是一个示例的CodePen链接：点击这里查看示例