为了账号安全,请及时绑定邮箱和手机立即绑定

13、优化轮播图组件与vue深度处理器

标签:
Vue.js

1、焦点问题

我们看到这里的焦点会有一个默认的颜色,改变这个焦点颜色也有一个小坑。

webp

问题所在

2、如何解决

(1)这里我们要用到vue的深度作用选择器,关于深度作用选择其详情看一看官网介绍:https://vue-loader-v14.vuejs.org/zh-cn/features/scoped-css.html

webp

vue官网

(2)用开发者工具找到这个点的class类名

webp

tools

(3)使用深度选择器把这个点变为白色

webp

深度选择器

ps:less里面不能用 >>> 这样写。

3、ok,最后的浏览器的效果就是这样了,perfect

webp

最终轮播图效果



作者:Ewall_
链接:https://www.jianshu.com/p/480062706465


点击查看更多内容
TA 点赞

若觉得本文不错,就分享一下吧!

评论

作者其他优质文章

正在加载中
  • 推荐
  • 评论
  • 收藏
  • 共同学习,写下你的评论
感谢您的支持,我会继续努力的~
扫码打赏,你说多少就多少
赞赏金额会直接到老师账户
支付方式
打开微信扫一扫,即可进行扫码打赏哦
今天注册有机会得

100积分直接送

付费专栏免费学

大额优惠券免费领

立即参与 放弃机会
微信客服

购课补贴
联系客服咨询优惠详情

帮助反馈 APP下载

慕课网APP
您的移动学习伙伴

公众号

扫描二维码
关注慕课网微信公众号

举报

0/150
提交
取消