중첩 규칙

nested rules, nesting
중첩 규칙, 중첩 룰; 중첩

1 Less/SCSS[ | ]

css

Copy

#header {
  color: black;
  .navigation {
    font-size: 12px;
  }
  .logo {
    width: 300px;
  }
}

css

Copy

nav {
  ul {
    margin: 0;
    padding: 0;
    list-style: none;
  }

  li { display: inline-block; }

  a {
    display: block;
    padding: 6px 12px;
    text-decoration: none;
  }
}

2 Sass[ | ]

css

Copy

nav
  ul
    margin: 0
    padding: 0
    list-style: none

  li
    display: inline-block

  a
    display: block
    padding: 6px 12px
    text-decoration: none

3 같이 보기[ | ]

less
Sass
SCSS
네스팅 (nesting)

4 참고[ | ]