말줄임표 처리

0. 원인

- 영역 width 보다 글자수가 많아서 넘치는 경우

1. css

- overflow: 영역을 초과했을때, 영역 밖에 대한 처리(hidden)

- text-overflow: 영역 밖으로 넘어간 글자에 대한 처리 ~ 생략, 말줄임표 ... (ellipsis)

- white-space: 줄바꿈 제어, 한줄로 처리하기 위해 묶음 X 처리 (nowrap)

overflow: hidden;

text-overflow: ellipsis;

white-space: nowrap;

1-1. 말줄임표 사용 후, 생략된 내용을 마우스 오버하여 확인

- html 태그에 title = "추가하려는 내용"

- 데이터 바인딩 가능하여 변수 할당할 수 있다.

ts

test: string = "데이터 할당 테스트";

html


<li title ="내용을 추가 합니다">


<li [title] = "test" >

2. 여러줄일경우

- 참고:

개발공부