Bagaimanakah saya boleh Menggunakan Nilai Harta CSS sebagai Parameter Campuran SASS?

Menggunakan Nilai Harta CSS sebagai Parameter Campuran SASS

Dalam percubaan untuk mencipta campuran jidar/padding universal, anda menghadapi isu yang melibatkan tetapan Sifat CSS sebagai nilai campuran. Artikel ini bertujuan untuk menyelesaikan isu ini dengan meneroka penggunaan interpolasi rentetan dalam campuran SASS.

Untuk menetapkan nilai sifat CSS sebagai nilai campuran, anda perlu menggunakan interpolasi rentetan. Teknik ini membolehkan anda membenamkan pembolehubah sebagai nama sifat dalam definisi campuran.

Berikut ialah versi terkini kod anda yang menggabungkan interpolasi rentetan:

[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);
  }
}

Sintaks #{$val} dalam definisi mixin membolehkan anda menetapkan sifat CSS secara dinamik nama.

Nota:

• Pemilih atribut seperti *="_m" juga boleh digunakan pada elemen yang mengandungi "_mid" dalam nama kelas mereka. Ini mungkin menggesa anda untuk memikirkan semula strategi penamaan anda.
• Interpolasi rentetan adalah penting untuk menggunakan pembolehubah sebagai nama sifat dalam takrifan campuran.

Atas ialah kandungan terperinci Bagaimanakah saya boleh Menggunakan Nilai Harta CSS sebagai Parameter Campuran SASS?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!