728x90
반응형
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
h1, p {
width: 300px;
}
.ellipsis{
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
</style>
</head>
<body>
<h1 class="ellipsis">Lorem ipsum dolor sit amet consectetur adipisicing elit</h1>
<p class="ellipsis">Lorem ipsum dolor sit amet consectetur adipisicing elit</p>
</body>
</html>
Lorem ipsum dolor sit amet consectetur adipisicing elit
Lorem ipsum dolor sit amet consectetur adipisicing elit
white-space: nowrap
: 탭&여러 번의 스페이스를 포함. 줄바꿈을 하지 않음
728x90
반응형
'HTML／CSS／JS' 카테고리의 다른 글
| [JS] if/else if 문으로 계절 출력하기 (0) | 2022.10.18 |
|---|---|
| [JS] 현재 시간 출력, if문 오전 오후 구분하기 (date(),getMonth(),getHours(),if,else) (0) | 2022.10.18 |
| [HTML5] 13. 중앙 정렬 레이아웃 (margin,width) (0) | 2022.10.18 |
| [HTML5] 12. 수평 정렬 레이아웃 (overflow, hidden,float) (0) | 2022.10.18 |
| [HTML5] 10. 배경/ 글자 속성 (background,font-family,text-decoration 등) (0) | 2022.10.17 |
