<div class="hoge">
  <div class="hoge__fuga">
    <p class="hoge__fuga--text">
      font-sizeを32pxで指定していますが、<span class="hoge__fuga--text__small">ここはfont-sizeを50%で指定</span>
    </p>
  </div>
</div>
.hoge {
  width: 400px;
  height: 300px;
  background: #ccc;
  &__fuga {
    width: 100%;
    height: 50%;
    background: #aaa;
    &--text {
      font-size: 32px;
      &__small {
        font-size: 50%;
      }
    }
  }
}
View Compiled

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.