vue 方法里面修改样式_VUE修改ElementUI默认样式的有效方法(已亲测)

最近做了一个VUE项目,前端使用的是饿了么框架,但是开发过程中遇到一个问题,饿了么框架的样式都已经封装好了,要想自定义一些个性化的样式,还是比较困难,就比如要修改el-input disabled状态下的字体颜色,就比较麻烦,尝试一番无果后,于是百度一下,得到以下结果

.el-input.is-disabled /deep/ .el-input__inner {

color: #606266;

}

有效果吗?确实有效果,但是随之又带来了另一个问题,就是所有disabled状态下的el-input字体颜色都变了,而我要的效果是针对某一个el-input框去改变字体颜色,兴匆匆的操作查询一番,然并卵...

好吧,看来没有现成的可以伸手了,还是自己造吧,这里也不卖关子了,直接公布结果,上代码...

type="text"

v-model="orderId"

size="mini"

:disabled="true"

@click.native="showOrderDetailDialog=true;"

class="rt-input"

>

.rt-input /deep/ .el-input__inner {

color: rgb(92, 112, 234) !important;

cursor: pointer;

}

看到这里也不需要我多说什么了,赶紧动手试试吧。

本文由周末简设原创出品,如需转载请注明出处

本文出处:http://www.youtiy.com/detail_460.html

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值