CodePen Embed - details and summary example

<details>
  <p>
    summary가 없으면 타이틀이 '세부정보'<br>
    html만으로도 가능합니다. 
  </p>
</details>
<details>
  <summary>
    클릭하세요 02
  </summary>
  <p>
    아직 크롬, 파이어폭스만 가능합니다.
  </p>
</details>

section {
  max-width: 500px;
}

details {
  background: #f0f0f0;
  padding: 20px;
  margin-bottom: 5px;
}

summary {
  cursor: pointer;
  font-weight: bold;
  font-size: 1.1em;
}

This Pen is owned by leeyoonseo on CodePen.

See more by @okayoon on CodePen

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.