elementui 修改组件默认样式
1.新建style.css,并在main.js中引入import “./assets/style/style.css”
2.覆盖样式,在单个xx.vue文件最后多写一对<style>…</style>标签,不要加scoped(不推荐)
如果写在有scoped属性的style标签里,覆盖的样式不会生效
类名之前要加上父级,否则会变成全局样式
3.<style scoped>中使用深度选择器,可以影响子组件(好用,推荐)
使用 >>> 操作符
<style scoped>
.addform >>> .el-form-item {
width: 100%;
}
在less,scss等预处理下,>>>不被解析,换成/deep/同样可以实现效果
<style scoped>
.addform /deep/ .el-form-item {
width: 100%;
}