JSFiddle - React, Tailwind, and code Playground

HTML

<div class="visible"><span>visible</span>이곳의 내용들은 W3C의 Cascading Style Sheets Level 2 Revision 1 Specification의 내용을 기본으로 하고 있습니다. 또한 좀 더 쉬운 설명을 위하여 다양한 예제들을 jsfiddle라는 서비스를 이용하여 제공하고 있으며, 이해를 높이기 위한 이미지들을 계속해서 업데이트 할 예정입니다.</div>

<div class="hidden"><span>hidden</span>이곳의 내용들은 W3C의 Cascading Style Sheets Level 2 Revision 1 Specification의 내용을 기본으로 하고 있습니다. 또한 좀 더 쉬운 설명을 위하여 다양한 예제들을 jsfiddle라는 서비스를 이용하여 제공하고 있으며, 이해를 높이기 위한 이미지들을 계속해서 업데이트 할 예정입니다.</div>

<div class="scroll"><span>scroll</span>이곳의 내용들은 W3C의 Cascading Style Sheets Level 2 Revision 1 Specification의 내용을 기본으로 하고 있습니다. 또한 좀 더 쉬운 설명을 위하여 다양한 예제들을 jsfiddle라는 서비스를 이용하여 제공하고 있으며, 이해를 높이기 위한 이미지들을 계속해서 업데이트 할 예정입니다.</div>

<div class="auto"><span>auto</span>이곳의 내용들은 W3C의 Cascading Style Sheets Level 2 Revision 1 Specification의 내용을 기본으로 하고 있습니다. 또한 좀 더 쉬운 설명을 위하여 다양한 예제들을 jsfiddle라는 서비스를 이용하여 제공하고 있으며, 이해를 높이기 위한 이미지들을 계속해서 업데이트 할 예정입니다.</div>

CSS

div {
    width:200px;
    height: 100px;
    background-color: #eee;
    border: 1px solid #999;
    font-size: 0.85em;
    float: left;
    margin: 40px 10px;
}
span {
    color: red; 
    font-weight:bold;
}
.visible {
    overflow: visible;
}
.hidden {
    overflow: hidden;
}
.scroll {
    overflow: scroll;
}
.auto {
    overflow: auto;
}