DIV를 초과하는 콘텐츠를 숨기는 방법

일반적으로 웹 페이지를 레이아웃할 때 텍스트 내용이 너무 많아서 한계를 초과하는 문제가 항상 발생합니다. 그런 다음 일부 사진이 DIV를 터뜨리고 웹 페이지를 어지럽고 어수선하게 만들 것입니다. 그러면 문제를 어떻게 해결합니까?

이제 CSS를 사용하여 DIV 레이아웃을 깨지 않고 설정된 CSS 너비와 CSS 높이를 초과하는 콘텐츠를 자동으로 숨기는 방법을 해결해야 합니다.

특히 IE6에서는 콘텐츠가 object의 높이와 너비를 초과하는 경우 늘어나서 높이가 증가합니다. 이때 다음 솔루션을 사용할 수 있습니다.

CSS 스타일에 대한 솔루션

이때 CSS를 사용할 수 있습니다. overflow스타일 솔루션:

해당 스타일 Overflow:hidden

Div{overflow:hidden}

이렇게 설정한 후 DIV 개체가 특정 너비와 높이를 지정한 다음 Overflow:hidden을 추가하면 이미지를 포함하여 DIV의 너비와 높이를 초과하는 콘텐츠가 숨겨집니다.

관련 읽기: CSS는 줄임표를 표시하기 위해 오버플로를 구현하고 텍스트 내용을 초과합니다.

초과 내용 대/소문자 숨기기

1. 개체 너비와 높이를 초과하는 텍스트 내용 숨기기

레이아웃에서 아름답게 정렬하는 경우 때로는 설정이 필요합니다. 객체의 높이와 너비는 그 이후에 수정되었습니다. 이때 콘텐츠와 텍스트가 아무리 많아도 레이아웃이 설정된 너비와 높이를 초과해서는 안 된다는 점을 인식해야 합니다. 오버플로:숨겨짐.

CSS 코드:

<style> 
.div{ width:300px; height:50px; line-height:25px; overflow:hidden} 
/* 设置对象高度宽度，同时设置overflow:hidden */ 
</style>

Html 코드:

<div class="div">欢迎，

여기에서 CSS를 배우고 필요한 리소스를 다운로드할 수 있습니다.

동시에 FAQ답변