input 2

230405/ 스터디 3일차 회고: HTML form 회원가입 양식 코딩

스터디 3일 차입니다. 주간회고록을 노션에 작성해보았습니다. 오늘은 새로운 강의는 없고, 첫 코드챌린지가 있었습니다. HTML 문서에서 여러 가지 input 태그를 집어넣어서 간단히 회원가입 양식을 만들어 보았습니다. 이미 한번 만들어본 코드이지만, 열심히 타이핑했습니다. 기존의 것과 겉모습은 똑같지만 이번엔 semantic 태그를 활용해서 header와 main으로 전체 html-body의 구조를 보여줄 수 있게 코드를 만들어서 마음에 듭니다. 문제 및 코드를 유출하면 (아마) 안되어서 여기 남길 수 없는 게 아쉽습니다. TIL 팁: 태그속성은 공식문서로 꼭 확인하자. input 태그로 만든 submit 버튼입니다. HTML 삽입 미리보기할 수 없는 소스 위의 버튼은 다음과 같은 코드로 만들어졌습니다...

<label>태그, 왜쓸까?: form 컨트롤 요소에 이름 붙이기

HTML 삽입 미리보기할 수 없는 소스 label(라벨 = 레이블) 태그의 기능 HTML의 label 태그는 이름 그대로 라벨 역할을 합니다. 폼(form) 내부에서 해당 폼의 조작을 담당하는 태그의 이름표로 쓰입니다다. 예시코드) 타겟에대한 정보 *for 속성에 라벨링 할 태그의 id를 집어넣습니다. label 태그를 사용하는 이유 1. self-closing 태그의 용도를 분명하게 보여줍니다. 위의 input 태그는 셀프-클로징(self-closing) 태그입니다. 셀프-클로징 태그는 다른 HTML 태그와 다르게, 내부에 다른 태그를 넣거나, 텍스트를 삽입할(innerText) 공간이 존재하지 않습니다. 바로여기가 innerHTML, innerText 그래서 해당 태그는 그 자신에 대한 정보를 제공하..