Vue-2.1scoped样式冲突

默认情况:写在组件中的样式会全局生效->因此很容易造成多个组件之间的样式冲突问题

1.全局样式:默认组件中的样式会作用到全局

2.局部样式:可以给组件加上scoped属性,可以让样式只作用于当前组件

复制代码
<style scoped>  </style>

scoped原理:

1.给当前组件模版的所有元素,都会被添加上一个自定义属性data-v-hash值

区分开不同的组件

2.css选择器后面,被自动处理,添加上了属性选择器div[data-v-hash]

相关推荐
Anarkh_Lee8 小时前
别再手写 conf 了!NgxFlow:基于 React Flow 的 Nginx 可视化与调试神器
前端·nginx·数据可视化
程序员Agions8 小时前
程序员邪修手册:那些不能写进文档的骚操作
前端·后端·代码规范
jqq6668 小时前
解析ElementPlus打包源码(五、copyFiles)
前端·javascript·vue.js
Awu12278 小时前
⚡IndexedDB:现代Web应用的高性能本地数据库解决方案
前端·indexeddb
似水流年_zyh8 小时前
canvas写一个选择音频区域的组件
前端·canvas
wordbaby9 小时前
TanStack Router 实战:如何优雅地实现后台管理系统的“多页签” (TabList) 功能
前端·react.js
凌览9 小时前
2026年1月编程语言排行榜|C#拿下年度语言,Python稳居第一
前端·后端·程序员
user86158185781549 小时前
Element UI 表格 show-overflow-tooltip 长文本导致闪烁的根本原因与解法
前端
不会写前端的小丁9 小时前
前端首屏渲染性能优化小技巧
前端
还不秃顶的计科生9 小时前
defaultdict讲解
开发语言·javascript·ecmascript