|
속성 |
설명 |
|
clip |
넘치는 텍스트를 자름 |
|
ellipsis |
말 줄임표로 잘린 텍스트가 있다고 표시 |
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
|
<!
DOCTYPE
html>
<html lang
=
"kr"
>
<head>
<meta charset
=
"utf-8"
>
<title>
키보드와 하루
</title>
<style>
div
{
margin-top
:
20px
;
width
:
200px
;
border
:
1px solid #000
;
}
</style>
</head>
<body>
1
<div style
='
overflow
:
hidden
;
white-space
:
nowrap
;
text-overflow
:
clip
'
>
키보드와 하루 입니다.키보드와 하루 입니다.키보드와 하루 입니다.키보드와 하루 입니다.키보드와 하루 입니다.
</div>
2
<div style
='
overflow
:
hidden
;
white-space
:
nowrap
;
text-overflow
:
ellipsis
'
>
키보드와 하루 입니다.키보드와 하루 입니다.키보드와 하루 입니다.키보드와 하루 입니다.키보드와 하루 입니다.
</div>
</body>
</html>
|
| [css3] list-style-image - 목록 스타일을 이미지로 넣기 (0) | 2021.04.09 |
|---|---|
| [css3] list-style-type - 목록 불릿과 번호 스타일 지정 (0) | 2021.04.09 |
| [css3] line-height - 줄 간격 조절 (0) | 2021.04.07 |
| [css3] text-indent - 텍스트 들여쓰기 (0) | 2021.04.06 |
| [css3] text-align - 텍스트 정렬 (0) | 2021.04.05 |
