本篇内容介绍了“element el-input删除边框的方法是什么”的有关知识，在实际案例的操作过程中，不少人都会遇到这样的困境，接下来就让小编带领大家学习一下如何处理这些情况吧！希望大家仔细阅读，能够学有所成！
我们在使用element ui的 el-input输入框时，会面临这样的问题：
官网的样式：
而我们需要的：
我们正常的操作是：但发现行不通…
然后经过查找资料，发现可以用” >>>“， 这是vue的深度选择器，vue引用了第三方组件，需要在组件中局部修改第三方组件的样式；所以我们更改代码：
<div class="inputDeep">
<el-input size="medium " value="工况结束时间"></el-input>
</div>
<style>
.inputDeep >>> .el-input__inner {
border: 0px;
box-shadow: 0 0 0 0px;
}
</style>但是发现并没有效果，原因是我们要在<style>标签内加上scoped属性才能生效
<style scoped>
.inputDeep >>> .el-input__inner {
border: 0px;
box-shadow: 0 0 0 0px;
}
</style>另外，有些Sass 之类的预处理器无法正确解析 >>>，可以使用 /deep/ 操作符( >>> 的别名)，如下：
<style scoped>
.inputDeep /deep/.el-input__inner {
border: 0px;
box-shadow: 0 0 0 0px;
}
</style>“element el-input删除边框的方法是什么”的内容就介绍到这里了，感谢大家的阅读。如果想了解更多行业相关的知识可以关注亿速云网站，小编将为大家输出更多高质量的实用文章！
免责声明：本站发布的内容（图片、视频和文字）以原创、转载和分享为主，文章观点不代表本网站立场，如果涉及侵权请联系站长邮箱：is@yisu.com进行举报，并提供相关证据，一经查实，将立刻删除涉嫌侵权内容。
