[HTML] Textarea element

HTML

[HTML] Textarea element

Dongi 2021. 11. 21. 14:29

에ㅔㅔㅔㅔ이 하유두인 브로?(캐나다 친구들이랑 하던 인사) 동기 여러분! 오늘은 Textarea를 넣는 방법에 대해 알아봅시다.

Textarea element

문자 구역(Textarea)은 뭘까요?

보통 어떤 회사의 제품 리뷰를 보내거나 의견을 보낼 때 이런 칸이 있죠?

자세한 설명 부탁드립니다. 가 있는 칸이 바로 문자 구역(Textarea)입니다.

코드를 뜯어보면 아래와 같습니다.

우리가 알아볼 내용은 밑줄 친 부분입니다!

코드 설명

<textarea></textarea> 문자 구역(textarea)의 태그
id는 혹시 <label> 태그와 같이 쓰게 된다면 연결하기 위해 사용될 수 있습니다
name는 식별을 위해 id와 같은 값을 적어주면 좋습니다.
rows는 가로 크기 cols는 columns의 줄임말로 세로 크기입니다.
placeholder는 문자 구역에 설명을 적어 넣을 수 있습니다.
<textarea>와 </textarea> 사이에 문자를 넣으면 문자 구역 안에 미리 문자를 넣어둘 수 있습니다.

한번 해보겠습니다!

태그 사이에 미리 문자를 써두고 실행한 경우

<!DOCTYPE html>
<html>
  <form>
    <label for="feedback">고객님의 서비스 경험을 적어주세요!</label>
    <br>
    <textarea id="feedback" name="feedback" rows="10" cols="40">자세히 적어주시면 감사하겠습니다.</textarea>
  </form>
</html>

태그 사이의 내용이 검은색 글씨로 출력됨, 사용자가 지우지 않으면 지워지지 않음

placeholder를 사용해서 문자를 써두고 실행한 경우

<!DOCTYPE html>
<html>
  <form>
    <label for="feedback">고객님의 서비스 경험을 적어주세요!</label>
    <br>
    <textarea id="feedback" name="feedback" rows="10" cols="40" placeholder="자세히 적어주시면 감사하겠습니다."></textarea>
  </form>
</html>

placeholder의 내용이 회색글씨로 출력됨, 사용자가 클릭시 사라지고 새로운 내용을 작성할 수 있음.

오늘의 느낌

오늘 저녁에 중국음식(진짜 중국음식)을 시켜 먹었는데, 사실 항상 중국음식을 먹으면 맛있어도 나중엔 느끼해지거나 맛이 없는 경우가 엄청 많았는데 오늘은 대박이였음. 항저우 스타일 국수를 시켜서 먹었는데 와 국물이 아주 아주 깊은 소고기 뭇국 맛이 났는데 어찌나 시원하고 깔끔하던지 고수(실란트로)도 적당히 넣어서 너무나도 맛있게 잘 먹고 지금 속도 아주 편안함. 날씨가 추워서 일본 라멘을 먹으려 했는데 속은 중국 국수가 더 편한 거 같음. 암튼 엄청난 발견을 해서 너무나도 기분이 좋음ㅋㅋㅋ