继续浏览精彩内容
慕课网APP
程序员的梦工厂
打开
继续
感谢您的支持,我会继续努力的
赞赏金额会直接到老师账户
将二维码发送给自己后长按识别
微信支付
支付宝支付

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

Ewall_
关注TA
已关注
手记 85
粉丝 7084
获赞 266

前言:上篇讲了vue里面轮播图组件的使用,还有有个小问题可以优化一下。
github:https://github.com/Ewall1106/mall

1、焦点问题

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

问题所在

2、如何解决

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

vue官网

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

tools

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

深度选择器

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

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

最终轮播图效果

打开App,阅读手记
1人推荐
发表评论
随时随地看视频慕课网APP