Селекторҳои хешу таборӣ дар фарогирии SASS

Биёед баррасӣ кунем, ки чӣ тавр дар SASS ҳангоми фарогирӣ селекторҳои гуногун илова кардан мумкин аст, ки элементҳоро аз рӯи хешу таборӣ интихоб мекунанд. Ба мисолҳо нигаред.

Мисол

Селектори фарзандӣ:

styles.scssdiv {
  > p {
    color: red;
  }
}

Натиҷаи компилятсия:

styles.cssdiv > p {
  color: red;
}

Мисол

Селектори ҳамсоя

styles.scssdiv {
  + p {
    color: red;
  }
}

Натиҷаи компилятсия:

styles.cssdiv + p {
  color: red; 
}

Мисол

Селектори хешӣ:

styles.scssdiv {
  ~ p {
    color: red;
  }
}

Натиҷаи компилятсия:

styles.cssdiv ~ p {
  color: red;
}

Масъалаҳои амалӣ

styles.scssul {
  color: red;
  
  > li {
    padding: 20px;
  }
}

styles.scssdiv {
  ul {
    > li {
      padding: 20px;
    }
  }
}