[Vue3 + TS + Vite] CSS穿透

Element-Plus UI 中的 <el-drawer> 为例

方法一

Template中

typescript 复制代码
<el-drawer>

CSS中

typescript 复制代码
<style lang="scss" scoped>
:deep(.el-drawer__header) {
    margin: 0px 0px 0px 0px; /*上 右 下 左*/
    box-sizing: border-box;
    padding: 0px 0px 0px 0px; /*上 右 下 左*/
}
</style>

方法二(没有什么是加个中间层解决不了的)

Template中

typescript 复制代码
<div class="el-drawer-box">
	<el-drawer>
</div>

CSS中

typescript 复制代码
<style lang="scss" scoped>
.el-drawer-box:deep(.el-drawer__header) {
    margin: 0px 0px 0px 0px; /*上 右 下 左*/
    box-sizing: border-box;
    padding: 0px 0px 0px 0px; /*上 右 下 左*/
}
</style>

参考链接:
设置elementPlus抽屉组件的header样式

相关推荐
Patrick_Wilson26 分钟前
iOS Safari Clipboard API 权限弹窗问题
前端·ios·safari
OpenTiny社区1 小时前
Naive UI × GenUI SDK:自定义物料库搭建实战
前端·ai编程
kyriewen1 小时前
我拿 4 个真实前端任务试了 GLM-5.3 Flash:代码一遍跑通,账单 4 分钱
前端·程序员·ai编程
IT_陈寒1 小时前
Vue的响应式更新有时候真的不听话
前端·人工智能·后端
风骏时光牛马1 小时前
AI编程常见问题梳理与要点解析
前端
前端snow2 小时前
ai agent -- LCEL 汇总
前端
计算机魔术师2 小时前
NVIDIA 季度营收指引达 1080 亿美元,首次突破单季千亿大关
前端
数据狐(Datafox)2 小时前
京东商品列表API技术解析与落地应用(含标准 JSON 示例)
java·大数据·前端·人工智能·python·数据分析·json
风萧何2 小时前
架构艺术,是权衡的艺术。
前端·javascript·架构
YIAN2 小时前
ESLint 新版 Flat Config 实战:团队代码风格统一,从这一份配置开始
前端·团队管理