> 웹 프론트엔드 > CSS 튜토리얼 > CSS에서 텍스트 영역 크기 조정을 비활성화하거나 제어하려면 어떻게 해야 합니까?

CSS에서 텍스트 영역 크기 조정을 비활성화하거나 제어하려면 어떻게 해야 합니까?

Barbara Streisand
풀어 주다: 2024-12-19 00:48:09
원래의
603명이 탐색했습니다.

How Can I Disable or Control Text Area Resizing in CSS?

텍스트 영역 크기 조정 비활성화

웹 개발 영역에서는 텍스트 영역의 크기 조정 동작을 제어하는 ​​것이 바람직한 경우가 많습니다. 기본적으로 텍스트 영역은 오른쪽 하단 모서리를 드래그하여 크기를 조정할 수 있으므로 사용자가 크기를 조정할 수 있습니다. 그러나 이 기능이 필요하지 않거나 바람직하지 않은 상황이 있습니다.

텍스트 영역의 크기 조정 속성을 비활성화하려면 CSS의 기능을 활용할 수 있습니다. 다음 규칙은 텍스트 영역의 크기가 조정되는 것을 효과적으로 방지합니다.

textarea {
  resize: none;
}
로그인 후 복사

이 규칙은 문서의 모든 텍스트 영역에 적용됩니다. 그러나 특정 텍스트 영역에 대한 크기 조정만 비활성화하려면 클래스 또는 속성 선택기를 활용할 수 있습니다.

예를 들어 "textarea1" 클래스를 사용하여 텍스트 영역에 대한 크기 조정을 비활성화하려면:

.textarea1 {
  resize: none;
}
로그인 후 복사

또는 이름이 지정된 특정 텍스트 영역의 크기 조정을 비활성화하려면 "foo":

textarea[name=foo] {
  resize: none;
}
로그인 후 복사

또는 ID 속성을 사용하려는 경우:

#foo {
  resize: none;
}
로그인 후 복사

W3C 사양은 "both", " 가로', '세로' 입니다. 이를 통해 조정할 수 있는 크기(너비 또는 높이)를 지정할 수 있습니다.

textarea {
  resize: vertical; /* Resize vertically, fixed width */
}
로그인 후 복사

"크기 조정" 속성은 "오버플로" 속성이 값으로 설정된 경우에만 적용된다는 점에 유의하는 것이 중요합니다. "보이는" 것 외에는. 따라서 크기 조정을 활성화하려면 텍스트 영역에 "스크롤" 또는 다른 적절한 값으로 설정된 "오버플로" 속성이 있는지 확인하세요.

위 내용은 CSS에서 텍스트 영역 크기 조정을 비활성화하거나 제어하려면 어떻게 해야 합니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
저자별 최신 기사
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿