Bagaimanakah anda menetapkan sifat CSS sebagai nilai campuran dalam SASS menggunakan interpolasi rentetan?

Menetapkan Nilai Campuran SASS kepada Sifat CSS

Apabila mencipta campuran jidar/padding universal, mungkin perlu menetapkan sifat CSS sebagai nilai campuran. Untuk mencapai matlamat ini, interpolasi rentetan digunakan.

Interpolasi Rentetan untuk Sifat CSS

Untuk menggunakan pembolehubah sebagai nama sifat CSS, interpolasi rentetan (#{$var}) diperlukan.

Contoh

Campuran berikut menunjukkan cara menetapkan sifat CSS menggunakan interpolasi rentetan:

<code class="scss">[class*="shift"] {
  $sft-o: 10px;
  @mixin shift_stp($val) {
    &[class*="_sml"]{ #{$val}: $sft-o; }
    &[class*="_mid"]{ #{$val}: $sft-o * 2; }
    &[class*="_big"]{ #{$val}: $sft-o * 3; }
  }
  &[class*="_m"]{
    @include shift_stp(margin);
  }
  &[class*="_p"]{
    @include shift_stp(padding);
  }
}</code>

Nota

Apabila menggunakan pemilih atribut (*="_m"), adalah penting untuk mempertimbangkan kemungkinan konflik dengan kelas lain yang mengandungi "_mid" dalam nama mereka.

Atas ialah kandungan terperinci Bagaimanakah anda menetapkan sifat CSS sebagai nilai campuran dalam SASS menggunakan interpolasi rentetan?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!