SASS

Question 1

1. Nested rules

Answer 1

main p {

color: #00ff00;
width: 97%;

  .redbox {
    background-color: #ff0000;
    color: #000000;
  }
}

Question 2

Variable declaration

Answer 2

$var : #FFF
$count : 4
$size : 12px

Question 3

Parent element

Answer 3

Parent element in scss means the element of current rule (can be a nested rule)

Question 4

& selector

Answer 4

Select the current parent element. Usually is used to apply properties for different states of the element, for example ‘hover’, ‘focus’

Question 5

Interpolation

Answer 5

{$variableName}

The objective of interpolation is to inject a variable into a string. For example in bootstrap
$list: “.col-xs-#{$i}, .col-sm-#{i}, .col-lg-#{i}”

If a variable is a string, interpolation will remove the quotes from it.