텍스트의 초과 부분을 숨기는 방법

이번에는 텍스트의 초과 부분을 숨기는 방법과 텍스트의 초과 부분을 숨길 때 어떤 메모가 있는지 보여드리겠습니다. 실제 사례를 살펴보겠습니다.

부분 너머로 텍스트를 숨기고, 두 가지 방법을 요약합니다.

1. 한 줄 숨기기

html 코드

<p class="mi">当文字超过范围的时候，超出部分会隐藏起来。</p>

css 코드

.mi {
    width: 200px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space:nowrap;
}

2. html 코드

<p class="mi">当文字超过范围的时候，超出部分会隐藏起来。可以设置第几行开始隐藏。</p>

css Code

.mi {
    width: 200px;
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:2;
}

이 글의 사례를 읽으신 후 방법을 마스터하셨다고 생각합니다. 더 흥미로운 정보를 보려면 PHP 중국어 웹사이트의 다른 관련 글을 주목해 보세요! 추천 자료:

3D 반투명 큐브를 구현하는 CSS

CSS3에서 진행률 표시줄을 구현하는 두 가지 방법

CSS에서 바닥글 하단을 구현하는 여러 가지 방법

위 내용은 텍스트의 초과 부분을 숨기는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!