<input type =“text”/>에서 여러 줄의 입력 id="Text1"

이 텍스트 입력 양식이 있습니다.

<input type="text"
       cols="40"
       rows="5"
       style="width:200px; height:50px;"
       name="Text1"
       id="Text1"
       value="" />

여러 줄의 입력을 받으려고합니다. 너비와 높이는 상자를 더 크게 만들지 만 사용자는 원하는 텍스트를 모두 입력 할 수 있지만 한 줄만 채 웁니다.

입력을 텍스트 영역처럼 만들려면 어떻게해야합니까?

여러 줄을 처리하려면 텍스트 영역을 사용해야합니다.

<textarea name="Text1" cols="40" rows="5"></textarea>

word-break: break-word;속성 을 제공하여 텍스트 입력 여러 줄을 만들 수 있습니다. (Chrome에서만 이것을 테스트했습니다)

당신은 할 수 없습니다. 글을 쓰는 시점에서 여러 줄로 디자인 된 유일한 HTML 양식 요소는 <textarea>입니다.

텍스트 영역 사용

<textarea name="textarea" style="width:250px;height:150px;"></textarea>

여는 태그와 닫는 태그 사이에 공백을 두지 마십시오. 그렇지 않으면 빈 줄이나 공백이 남습니다.

이것을 확인하십시오 :

TEXTAREA 요소는 여러 줄로 된 텍스트 입력 컨트롤을 만듭니다.

textarea여러 줄 입력을 지원하는 데 사용해야 합니다.

<textarea rows="4" cols="50">
Here you can write some text to display in the textarea as the default text
</textarea>

자동 높이 가있는 텍스트 영역 이 필요한 경우 순수 자바 스크립트로 다음을 사용하십시오.

function auto_height(elem) {  /* javascript */
    elem.style.height = "1px";
    elem.style.height = (elem.scrollHeight)+"px";
}

.auto_height { /* CSS */
  width: 100%;
}

<textarea rows="1" class="auto_height" oninput="auto_height(this)"></textarea>

How IT