ElementUI のデフォルト スタイルを変更する方法

1.スコープなしでスタイルを追加します（複数ある場合があります

<style lang='scss'>
	.el-button{
    
    
		background-color: red;
	}
</style>

2. スコープ付きのネイティブ css 書き込み方法: >>>を使用します( >>>の前に親要素または祖先要素を配置できます)。

<style scoped>
.buttonWrapper >>> .el-button{
    
    
    background-color: red;
}
</style>

3.プロジェクトで使用される scss、sass、および less はすべて/deep/を使用できます

<style lang='scss' scoped>
/deep/ .el-button{
    background-color: blue;
}
</style>

または: :v-deep

<style lang='scss' scoped>
::v-deep .el-button{
    background-color: gold;
}

ページに複数の同一のコンポーネントがある場合、ページのスタイルを汚染しないようにするために、組み合わせセレクターを使用して個々のコンポーネントのスタイルを正確に変更することもできます

<style lang='scss' scoped>
/deep/ .buttonWrapper .el-button{
      background-color: red;
  }
</style>