728x90
overflow: hidden; ← 넘어간 내용을 감춘다.
text-overflow: ellipsis; ← 넘어간 내용을 ... 처리해준다
.cardBoxText{
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
<div class="cardBoxText">
<div class="">
<strong class="d-inline-block mb-lg-1 text-success reviewCategory">중식</strong>
<h5 class="card-title cardTitle">중화요리 팔공</h5>
<p class="card-text mb-1 reviewDate">22.02.22 | 조회수 50회</p>
<p class="card-text mb-auto reviewNormal">위치 : 서울 관악구 신림동 10-621 지하 1층</p>
<p class="card-text mt-3 mb-auto reviewFeatureTitle">간단 소개</p>
<p class="card-text reviewNormal">푸짐한 양과 아낌없는 재료
푸짐한 양과 아낌없는 재료푸짐한 양과 아낌없는 재료푸짐한 양과 아낌없는 재료푸짐한 양과 아낌없는 재료푸짐한 양과 아낌없는 재료푸짐한 양과 아낌없는 재료푸짐한 양과 아낌없는 재료푸짐한 양과 아낌없는 재료푸짐한 양과 아낌없는 재료푸짐한 양과 아낌없는 재료푸짐한 양과 아낌없는 재료푸짐한 양과 아낌없는 재료푸짐한 양과 아낌없는 재료푸짐한 양과 아낌없는 재료푸짐한 양과 아낌없는 재료
</p>
<!-- <p class="card-text"><small class="text-muted">Last updated 3 mins ago</small></p> -->
</div>
</div>
728x90
반응형
'small steps > 1일 1코딩 - 코딩을 내 몸처럼' 카테고리의 다른 글
| [1일1코딩] (0) | 2022.05.06 |
|---|---|
| [1일1코딩][bootstrap] 글씨 크기 조절, 페이지네이션 글씨 크기 조절 (0) | 2022.05.05 |
| [1일1코딩][CSS] 자손 선택자 + hover (0) | 2022.05.03 |
| [1일1코딩][Java-JDBC] MVC패턴 Template클래스의 getConnection메소드 (0) | 2022.05.02 |
| [1일1코딩][Java-JDBC] MVC패턴 Model.DAO (0) | 2022.05.01 |
