텍스트 영역의 내용 크기를 자동으로 조정하고 스크롤 막대를 숨기려면 어떻게 해야 합니까?-CSS 튜토리얼-php.cn

텍스트 영역의 내용 크기를 자동으로 조정하고 스크롤 막대를 숨기려면 어떻게 해야 합니까?

Linda Hamilton

풀어 주다： 2024-12-13 02:48:10

원래의

804명이 탐색했습니다.

How Can I Make a Textarea Automatically Resize to its Content and Hide Scrollbars?

콘텐츠에 따라 텍스트 영역 높이 결정, 스크롤 막대 제거

문제:

텍스트 영역 높이에 맞게 동적으로 조정되는 텍스트 영역 높이 달성 콘텐츠를 제공하므로 필요하지 않습니다. 스크롤바.

JavaScript를 사용한 솔루션:

function auto_grow(element) {
  element.style.height = "5px";
  element.style.height = (element.scrollHeight) + "px";
}

로그인 후 복사

CSS 스타일 지정:

textarea {
  resize: none;
  overflow: hidden;
  min-height: 50px;
  max-height: 100px;
}

로그인 후 복사

구현:

<textarea oninput="auto_grow(this)"></textarea>

로그인 후 복사

이 코드를 사용하면 텍스트 영역의 높이가 콘텐츠에 맞게 확장되거나 축소되므로 필요가 없습니다. 스크롤바용.

위 내용은 텍스트 영역의 내용 크기를 자동으로 조정하고 스크롤 막대를 숨기려면 어떻게 해야 합니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!