element-ui设置高度height属性与style属性设置的区别

在Element UI中，设置元素的高度（height）通常是通过CSS样式来完成的，而style属性是HTML元素的一个属性，可以直接在元素上设置内联样式。

使用CSS设置高度时，可以通过class来指定样式，而style属性更适合动态设置样式，即基于JavaScript的条件或用户交互来改变样式。

例如，如果你想要设置一个Element UI的组件的高度，你可以这样做：

使用CSS类设置高度：

<!-- 在你的组件上添加一个class -->
<el-button class="my-button">按钮</el-button>
 
<!-- 在你的样式文件中定义.my-button的样式 -->
<style>
.my-button {
  height: 100px;
}
</style>

使用style属性设置高度：

<!-- 使用内联样式直接在元素上设置高度 -->
<el-button style="height: 100px;">按钮</el-button>

如果你需要在JavaScript中动态改变高度，你可能会使用style属性：

// 假设你有一个方法来改变按钮的高度
function changeHeight(newHeight) {
  document.querySelector('.my-button').style.height = newHeight + 'px';
}
 
// 调用函数改变高度
changeHeight(150); // 将高度设置为150px

在实际应用中，尽可能使用CSS类来设置样式，因为这样更易于维护和理解，同时也有助于提高性能。只有当动态样式是必须的时候才使用style属性。