resize 속성

resize 속성은 textarea 나 다른 요소들의 크기 변경을 허용하거나 금지합니다 (다른 요소들은 모든 브라우저에서 동작하지 않을 수 있습니다).

구문

선택자 {
	resize: both | horizontal | vertical | none;
}

기본값: none. 일부 브라우저에서는 textarea에 대해 both입니다. resize를 지원하지 않는 브라우저에서는 textarea가 none 값이 지정된 것처럼 동작합니다.

요소가 양방향으로 늘어납니다:

<textarea></textarea>

textarea {
	resize: both;
	width: 200px;
	height: 200px;
}

요소가 수평 방향으로만 늘어납니다:

<textarea></textarea>

textarea {
	resize: horizontal;
	width: 200px;
	height: 200px;
}

요소가 수직 방향으로만 늘어납니다:

<textarea></textarea>

textarea {
	resize: vertical;
	width: 200px;
	height: 200px;
}

요소가 전혀 늘어나지 않습니다:

<textarea></textarea>

textarea {
	resize: none;
	width: 200px;
	height: 200px;
}

max-width, min-width, max-height, min-height 속성을 사용하여 최소 및 최대 너비와 높이를 제한할 수 있습니다:

<textarea></textarea>

textarea {
	resize: both;
	min-height: 100px;
	max-height: 300px;
	min-width: 100px;
	max-width: 300px;
}