如何修改Element-UI的input样式

Question

1、使用css覆盖样式，无法生效

2、代码如下：

<el-form-item>

   <el-input v-model="form.name" auto-complete="off" placeholder="手机号\邮箱\用户名" class="login-form-input"></el-input>

</el-form-item>

<style>

    .login-form-input .el-input__inner {

        border: 0 none;

        border-bottom: 1px solid #ccc;

        border-radius: 0px;

    }

</style>

3、写后css样式没有变化

Answer 1

建议使用 >>> 或者 /deep/ 穿透做 因为如果你按照楼上说的,你吧scoped去掉会影响到所有页面的样式 如果只修改某个vue文件下的组件样式 不建议去掉scoped,但是如果你是要修改全局的样式就另说啦

Answer 2

在vue中，把style的scoped去掉就可以了。跟作用域有关