elementuiPlus取消el-input的边框

作者：System 时间：2024年08月27日分类：所有,elementui 字数：510

在Element UI Plus中，要想取消el-input的边框，可以通过CSS覆盖其默认样式来实现。以下是一个简单的CSS样式，用于移除el-input的边框：




.el-input__inner {
  border: none !important; /* 移除边框 */
  box-shadow: none !important; /* 移除阴影 */
}

将上述CSS添加到你的全局样式文件中，或者在组件的<style>标签中使用scoped属性时，使用深度选择器：




<style scoped>
::v-deep .el-input__inner {
  border: none !important;
  box-shadow: none !important;
}
</style>

确保使用!important来覆盖默认样式，因为它具有更高的优先级。如果你不想使用!important，则需要确保你的自定义样式在全局样式中后加载，或者确保使用了正确的选择器层级来覆盖默认样式。