TextArea의 Resizable 속성을 어떻게 비활성화합니까?
질문
TextArea의 Resizable 속성을 비활성화하고 싶습니다.
현재 TextArea의 오른쪽 하단 모서리를 클릭하고 마우스를 드래그하여 TextArea의 크기를 조정할 수 있습니다.이것을 어떻게 비활성화 할 수 있습니까?

답변
다음 CSS 규칙은 TextArea 요소의 크기 조정 동작을 비활성화합니다.
textarea {
resize: none;
}
일부 (하지만 전부는 아님) textareas에 대해 비활성화하려면 몇 가지 옵션이 있습니다.
태그의 클래스 속성을 사용할 수 있습니다 (
.textarea1 {
resize: none;
}
Name 속성을 Foo로 설정 한 특정 TextArea를 비활성화하려면 (즉,
textarea[name=foo] {
resize: none;
}
또는 ID 속성을 사용하여 (즉,
#foo {
resize: none;
}
W3C 페이지에는 제한 조정을위한 가능한 값이 나열됩니다. 없음, 둘 다, 수평, 수직 및 상속 :
textarea {
resize: vertical; /* user can resize vertically, but width is fixed */
}
괜찮은 호환성 페이지를 검토하여 현재이 기능을 지원하는 브라우저를 확인하십시오.Jon Hulka가 논평 한 것처럼 최대 폭, 최대 높이, 최소 폭 및 최소 높이를 사용하여 CSS에서 치수를 추가로 억제 할 수 있습니다.
슈퍼 알고 있어야합니다. 이 속성은 오버 플로우 속성이 표시 이외의 다른 요소이 아니면 대부분의 요소의 기본값입니다.일반적으로 이것을 사용하려면 오버플로와 같은 것을 설정해야합니다. 스크롤; Sara Cope의 인용문, http://css-tricks.com/almanac/properties/r/resize/
답변
CSS에서 ...
textarea {
resize: none;
}
답변
나는 두 가지를 발견했다.
첫 번째
textarea{resize: none}
이것은 아직 출시되지 않은 CSS 3이며 Firefox 4 (그리고 나중에), 크롬 및 사파리와 호환됩니다.
또 다른 형식 기능은 오버플로 : AUTO를 사용하여 DIR 속성을 고려하여 오른쪽 스크롤 막대를 제거합니다.
코드 및 다른 브라우저
기본 HTML.
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<textarea style="overflow:auto;resize:none" rows="13" cols="20"></textarea>
</body>
</html>
일부 브라우저
Internet Explorer 8.

Firefox 17.0.1.

크롬

답변
CSS 3에는이 작업을 수행 할 수있는 UI 요소의 새 속성이 있습니다.속성은 크기 조정 속성입니다.따라서 모든 TextArea 요소의 크기 조정을 비활성화하려면 스타일 시트에 다음을 추가합니다.
textarea { resize: none; }
이것은 CSS 3 속성입니다.호환성 차트를 사용하여 브라우저 호환성을보십시오.
개인적으로, TextArea 요소에서 장애 조치를 취하기 위해 매우 성가신 것을 알게 될 것입니다.이것은 디자이너가 사용자의 클라이언트를 "끊으려고"하는 상황 중 하나입니다.디자인이 더 큰 TextArea를 수용 할 수없는 경우 디자인이 어떻게 작동 하는지를 다시 사용해야합니다.모든 사용자는 TextArea {Resize : 둘 다! 중요;} 사용자의 스타일 시트에 대한 사용자의 선호도를 무시하십시오.
답변
<textarea style="resize:none" rows="10" placeholder="Enter Text" ></textarea>
답변
깊은 지원이 필요한 경우 오래된 학교 기술을 사용할 수 있습니다.
textarea {
max-width: /* desired fixed width */ px;
min-width: /* desired fixed width */ px;
min-height: /* desired fixed height */ px;
max-height: /* desired fixed height */ px;
}
출처:https://stackoverflow.com/questions/5235142/how-do-i-disable-the-resizable-property-of-a-textarea
최근댓글