

<!DOCTYPE html>
<head>
<title>text-overflow 속성</title>
<meta charset="utf-8">
<style>
div{width:300px; height: 30px;background-color:yellow; border:1px solid black;padding:5px;}
#one{overflow: hidden;white-space: nowrap; text-overflow:clip;}
#two{overflow: scroll; white-space: nowrap; text-overflow: ellipsis;}
#three{overflow: auto;white-space: nowrap; text-overflow: ellipsis;}
</style>
</head>

<body>
 
<h3>text-overflow: clip</h3>
<div id="one">
It took me a long time to learn where he came from. 
The little prince, who asked me so many questions,   
</div>
<h3>text-overflow: ellipsis</h3>
<div id="two">
It took me a long time to learn where he came from. 
The little prince, who asked me so many questions,   
</div>
<h3>text-overflow: ellipsis2</h3>
<div id="three">
It took me a long time to learn where he came from. 
The little prince, who asked me so many questions,   
</div>
 

</body>

</html>