Detaillierte Erklärung zum Ändern des Stils von el-select: popper-append-to-body und popper-class

<el-Auswahl
    :popper-append-to-body="false"
    v-Modell="Aufgabentyp"
    Platzhalter="Bitte auswählen"
    Größe="mini"
    Klasse="Stil auswählen"
    Popper-Klasse = "Popper auswählen"
  >
    <el-Option
      v-for="(Element, Index) in Aufgabentypen"
      :Schlüssel="Index"
      :Wert="Artikel.Wert"
      :label="Artikel.label"
    ></el-Option>
  </el-Auswahl>

.Stil auswählen {
    Breite: 3rem;
    Rand rechts: 0,36rem;
    /deep/.el-input__inner {
      Rahmen-oben-links-Radius: 0;
      Rahmen unten links-Radius: 0;
      Rand: 1px durchgezogen #a1a3ad;
      Rahmenbreite links: 0;
      Hintergrundfarbe: rgba(0, 0, 0, 0,8);
      Schriftfamilie: PingFangSC-Regular;
      Schriftgröße: 0,28rem;
      Farbe: rgba(255, 255, 255, 0,6);
    }
  }

/deep/.select-popper {
    Hintergrundfarbe: $item-bg-color;
    Randradius: 0,08rem;
    Rand: durchgezogen 0,02rem #1c395d;
    Schriftfamilie: PingFangSC-Regular;
    .el-select-dropdown__item.selected {
      Schriftfamilie: PingFangSC-Regular;
      Schriftgröße: 0,28rem;
      Farbe: rgba (74, 141, 253, 1);
    }
    li {
      Farbe: #fff;
      Hintergrund: transparent;
      Farbe: #fff;
      Schriftgröße: 0,28rem;
    }
    .el-select-dropdown__item:hover,
    .el-select-dropdown__item.hover {
      Hintergrundfarbe: rgba(110, 147, 206, 0,2);
      Rand rechts: 1px;
    }
    .popper__arrow::nach {
      Farbe des unteren Rahmens: $item-bg-color;
    }
    .popper__arrow {
      Farbe des unteren Rahmens: $item-bg-color;
    }
    .el-select-dropdown__empty {
      Polsterung: 0,2rem;
      Schriftgröße: 0,28rem;
    }
  }