当前位置:网站首页>深度选择器
深度选择器
2022-04-23 09:54:00 【YoungMan_09】
项目开发过程中,经常会使用到第三方组件库的组件,以便快捷的构建功能模块。
例如;使用 Element UI 的走马灯(轮播图)组件
<el-carousel height="150px">
<el-carousel-item v-for="item in 4" :key="item">
<h3 class="small">{
{ item }}</h3>
</el-carousel-item>
</el-carousel>
这个时候想修改左右箭头指示器的样式或者偏移位置
查看自带的样式代码
无论是直接使用 button 标签选择器 还是其 类名 都无法选到来修改样式
这是因为在style中使用了 less(scss) 和 scoped
这个时候就需要用到 深度选择器了
例如,修改button大小和位置,使用::v-deep
::v-deep .el-carousel__arrow--left {
width: 50px;
height: 50px;
left: 100px;
background-image: url('~@/assets/images/indeximg/left.png');
}
::v-deep .el-carousel__arrow--right {
right: 100px;
width: 50px;
height: 50px;
background-image: url('~@/assets/images/indeximg/right.png');
}
还有其它写法如 >>> 或者是 /deep/,但是这里都不起作用,所以用::v-deep
简单记录一下
版权声明
本文为[YoungMan_09]所创,转载请带上原文链接,感谢
https://blog.csdn.net/YoungMan_09/article/details/124183560
边栏推荐
- Exclusive thoughts and cases of JS
- 实践六 Windows操作系统安全攻防
- Practice of Flink streaming batch integration in Xiaomi
- Function realization of printing page
- Personal homepage software fenrus
- Custom login failure handling
- MapReduce核心和基础Demo
- Redis exception read error on connection solution
- 杰理之通常程序异常情况有哪些?【篇】
- 自定义登录失败处理
猜你喜欢
AI上推荐 之 MMOE(多任务yyds)
ABAP CDs view with association example
SAP excel has completed file level validation and repair. Some parts of this workbook may have been repaired or discarded.
Acquisition of DOM learning elements JS
[educational codeforces round 80] problem solving Report
Setnx command execution failed due to full redis memory
Where is int a = 1 stored
Yarn资源调度器
[COCI] lattice (dichotomy + tree divide and conquer + string hash)
MapReduce计算流程详解
随机推荐
MapReduce计算流程详解
SAP 03-amdp CDs table function using 'with' clause
实践六 Windows操作系统安全攻防
Golang force buckle leetcode 396 Rotation function
Setnx command execution failed due to full redis memory
Simply understand = = and equals, why can string not use new
C language: expression evaluation (integer promotion, arithmetic conversion...)
Solving Lucas number and combination theorem
ABAP 7.4 SQL Window Expression
Nine abilities of agile manufacturing in the era of meta universe
Redis exception read error on connection solution
Pyqt5 and communication
Comparison of overloading, rewriting and hiding
杰理之有时候定位到对应地址的函数不准确怎么办?【篇】
Nvidia最新三维重建技术Instant-ngp初探
Yarn核心参数配置
杰理之有时候发现内存被篡改,但是没有造成异常,应该如何查找?【篇】
第二章 Oracle Database In-Memory 体系结构(上) (IM-2.1)
MapReduce核心和基础Demo
DBA常用SQL语句(4)- Top SQL