elementUI の el-button の背景色とサイズを広げたり高くしたり、既定の色の境界線を削除したり、庭の角度を変更したりします

1.サイズ設定

幅と高さを設定するには、サイズを最小に変更し、el-button に size="mini" を追加して幅と高さを設定する必要があります。

2.背景色（モラン見本色 type="primary"）

(1)背景色を変更したい場合、背景色style="background: #fb435f"が表示されますが、デフォルトの色の境界線があり
ます. プライマリ el-button の外側の div に名前を追加します. これを.bg_btn >>> .el-button--primary { border: none; }追加して、デフォルトの境界線を削除します

(2)背景色メソッドを追加:

  .bg_btn button { width: 41px; height: 18px; background: #fb435f; } 
  .bg_btnbutton:first-child { background: #0cc87e; } 

3. フォントサイズ

 .bg_btn span { position: relative; bottom: 5px; right: 5.2px; }

デフォルトの境界線があります

取り外した後

4. ラウンド アングルを削除し、このスタイルを追加します. クラス名 el-button–mini は、f12 レビュー要素で表示できます

.bg_btn .el-button--mini {
    border-radius: inherit;
}

取り外す前に

取り外した後

5. ソースコード

 <div class="bg_btn">
        <el-button size="mini" type="primary" @click="ignore(item, index)"><span>忽略</span></el-button>
  		<el-button size="mini" style="background: #fb435f" type="primary" @click="buy(item, index)"><span>购买</span></el-button>
 </div>

.bg_btn {
    display: flex;
    flex-direction: row;
    margin-top: 10px;
    margin-left: 40%;
    width: 50%;
    height: 27px;
}
.bg_btn >>> .el-button--primary {
    border: none;
}
.bg_btn button {
    width: 41px;
    height: 18px;
    font-family: SourceHanSansCN-Regular;
    font-size: 12px;
    font-weight: normal;
    color: #ffffff;
    position: relative;
    left: 20%;
    background: #fb435f;
}
.bg_btn button:first-child {
    background: #0cc87e;
}
.bg_btn span {
    position: relative;
    bottom: 5px;
    right: 5.2px;
}
.bg_btn .el-button--mini {
    border-radius: inherit;
}