문서의 선택한 두 판 사이의 차이를 보여줍니다.
양쪽 이전 판 이전 판 다음 판 | 이전 판 | ||
html:css:text [2011/12/06 20:12] kwon37xi |
html:css:text [2012/05/25 12:14] (현재) kwon37xi [여러 줄 텍스트 길이 제한] |
||
---|---|---|---|
줄 7: | 줄 7: | ||
/* 넓이가 명시된 상태 */ | /* 넓이가 명시된 상태 */ | ||
width: | width: | ||
+ | </ | ||
+ | |||
+ | ===== 여러 줄 텍스트 길이 제한 ===== | ||
+ | * [[http:// | ||
+ | * [[http:// | ||
+ | <code css> | ||
+ | /* WebKit */ | ||
+ | .giveMeEllipsis { | ||
+ | overflow: hidden; | ||
+ | text-overflow: | ||
+ | display: -webkit-box; | ||
+ | -webkit-line-clamp: | ||
+ | -webkit-box-orient: | ||
+ | } | ||
+ | |||
+ | /* Cross Browser 3줄일 경우.*/ | ||
+ | p { | ||
+ | position: | ||
+ | line-height: | ||
+ | height: | ||
+ | } | ||
+ | p::after { | ||
+ | content:" | ||
+ | font-weight: | ||
+ | position: | ||
+ | bottom:0; | ||
+ | right:0; | ||
+ | padding:0 20px 1px 45px; | ||
+ | background: | ||
+ | } | ||
</ | </ | ||