ElementUI组件的样式修改

随笔

这里只提供关键词

1.css

• 定义一个全局的css文件
• 在main.js引入该文件，就可以对ElementUI的样式进行修改了

2.less或scss

• 在Vue的style标签中，使用less或scss
• 可以使用/deep/ 或 ::v-deep 刺穿的写法

代码

1.main.js

//1.自定义全局css样式
import './assets/css/base.css'

2. less

<style lang="less" scoped>
	/deep/.el-input__inner {
	    box-shadow: 1px 1px 5px 1px  RGB(128,255,255,0.8) inset;
	    height: 30px;
	    color: #dc2929;
	  }
  </style>

3.scss

<style lang="scss" scoped>
	::v-deep .el-input__inner {
	    box-shadow: 1px 1px 5px 1px  RGB(128,255,255,0.8) inset;
	    height: 30px;
	    color: #dc2929;
	  }
  </style>