반응형
text-overflow : 텍스트가 영역을 넘어가면 어떻게 할지 결정해줌
[display : -webkit-box] => 아래 속성들을 사용하기 위해 작성해줌
-webkit-line-clamp : 영역 내의 최대 라인 수를 결정한다.
-webkit-box-orient : 영역 박스 내의 정렬 방향을 정해줌
div { overflow: hidden; /* 영역 밖으로 나간 컨텐츠를 안보이게 숨겨줌 */ text-overflow: ellipsis /* 영역 밖의 텍스트를 말줄임으로 표시해줌 */ display: -webkit-box -webkit-line-clamp : 3; /* 3줄만 나타냄 */ -webkit-box-orient : veritcal /* 정렬을 수직으로 해줌 */ }
반응형
'프로그래밍 > 기타' 카테고리의 다른 글
[Vue.js] click 이벤트 submit 새로고침 방지 (0) | 2022.01.27 |
---|---|
Vue 2에서 vue-cli 대신 Vite 사용하기 (0) | 2022.01.16 |
[nods.js] Express로 서버 구축하기 (w/o Generator) - 1 (0) | 2021.10.08 |
[Android] ViewBinding 을 써야하나..? (0) | 2021.09.27 |
Spring과 React 통신 시에 CORS 에러 해결 (0) | 2021.06.10 |