<텍스트 영역> 태그는 많은 HTML 태그 중 하나입니다. <텍스트 영역> 태그 형식은 여는 태그()의 세 가지 주요 부분으로 나뉩니다. 사용자는 양식에 HTML 태그를 사용하여 텍스트 영역을 생성함으로써 여러 줄에 걸쳐 텍스트를 입력할 수 있습니다. <텍스트 영역> 태그는 많은 문자를 담을 수 있는 텍스트 영역을 생성합니다.
textarea 요소는 열, 행 또는 둘 다와 같은 속성을 사용하여 지정된 영역이나 공간을 만듭니다. CSS 스타일과 높이 및 너비 속성은 모양과 느낌의 형식을 지정할 수 있습니다.
구문:
<textarea rows="3" cols="20"> Enter your text here... </textarea>
<텍스트 영역> 태그는 다른 모든 HTML 태그와 마찬가지로 양식 요소. 아래에 나열되어 있습니다:
텍스트 영역 요소의 작업을 더 자세히 이해하려면
코드:
<form> <p>Leave your Comment:</p> <br /> <textarea id="ta" cols="60" rows="5"> Write Here...</textarea></form>
출력:
위의 예는
행과 열을 사용하면 프로그래머는 텍스트 영역의 크기, 즉 텍스트 영역이 차지할 정확한 공간에 대한 경계 값을 설정할 수 있습니다. 브라우저 기본값이 다를 수 있으므로 이러한 속성을 사용하면 브라우저 간 지원 및 형식 일관성에 도움이 됩니다.
코드:
<!DOCTYPE html> <html> <head> <title> Textarea HTML Tag Demo </title> </head> <body> <form> <p>Fill the Detail:</p> <br /> <textarea rows="5" cols="40" name="demo" maxlength="60" minlength="10" required="required">Enter your name</textarea> <br /> <input type="submit" name="Submit" value="Submit" /> </form> </body> </html>
출력:
위의 예는
HTML5에는 최대 길이 속성이 추가되었습니다. HTML은 이 속성을 지원하지 않았습니다. 텍스트 영역에는 'minlength' 속성에 설정된 대로 최소 10자가 필요합니다. '필수' 속성은 사용자가 유효한 것으로 간주되어 제출되기 위해 텍스트 영역을 비워둘 수 없음을 나타냅니다. 태그에 대한 간단한 검증입니다.
코드:
<form id="Form1"> <label>Textarea Box 1</label> <br /> <textarea rows="5" cols="40" name="demo" maxlength="60" minlength="10" disabled="disabled"> This is Disabled</textarea> <br /> <label>Textarea Box 2</label> <br /> <textarea rows="5" cols="40" required="required"></textarea> <br /> <label>Textarea Box 3</label> <br /> <textarea rows="5" cols="40" placeholder="This is readonly textarea" readonly="readonly"></textarea> <br /> <input type="submit" name="Submit" value="Submit" /> </form>
출력:
'텍스트 영역 상자 2' 텍스트 영역은 필수 텍스트 영역인 반면 '텍스트 영역 상자 1'은 비활성화되어 있습니다.
코드:
<form id="label2" action="textareaDemo.html"> <fieldset> <legend><b>Form 2</b></legend> <input type="text" name="FN" value="Name" /> <br /> <input type="submit" name="Submit" value="Submit" /> <br /> </fieldset> </form> <textarea rows="5" cols="40" form="label2" required="required"></textarea> <br /> <p>Above Text Area belongs to 'Form 2'</p>
출력:
아래 출력을 참고하세요. 아래의 텍스트 영역 상자는 '필수' 필드이며, 위 코드에서 언급한 것처럼 이 필드는 'Form 2' 양식과 연결됩니다. 따라서 빈 텍스트 영역이 있는 양식을 제출하려고 하면 경고가 표시됩니다.
<텍스트 영역> 요소는