[CSS] 텍스트가 넘칠때... (텍스트 한줄효과) text-overflow
2021. 3. 13. 01:55ㆍProgram/CSS
텍스트가 넘칠때... text-overflow
CSS의 속성 세트가 숨겨진 오버 플로우의 콘텐츠에서 문자열이 넘치는 현상을 다음과 같이 정리할 수 있다.
(이 text-overflow의 속성은 인라인에서 블록 컨테이너 요소를 넘쳐나는 콘텐츠에만 영향을 준다.)
text-overflow: clip;
/* 컨텐츠 영영의 한도에서 텍스트를 자르기 때문에 문자 중간에서 잘릴 수 있음 */
text-overflow: ellipsis;
/* 잘린 텍스트를 줄임표 (...)로 표시하여 줌 하지만 줄임표를 표시할 공간이 없으면 역시 잘림...*/
text-overflow: "-";
text-overflow: "";
텍스트가 컨테이너를 넘치게 하려면 다른 CSS 속성을 설정하도록 한다.
overflow: hidden;
white-space: nowrap;
'Program > CSS' 카테고리의 다른 글
[CSS] 반응형 웹 미디어쿼리(@media) 디바이스 별 해상도 분기점 (0) | 2022.08.25 |
---|---|
[CSS] 말 줄임 효과 (한줄 효과, 두줄 효과, 세줄 효과) (0) | 2021.04.05 |
[CSS] 패딩값과 보더값을 포함시키는 box-sizing (0) | 2021.03.12 |
[CSS] 컨텐츠 요소 중앙정렬 방법 (0) | 2021.03.10 |
[CSS] 클리어픽스(clearfix) (0) | 2021.03.02 |