인프런 커뮤니티 질문&답변

작성한 질문수

반응형 웹사이트 포트폴리오(Architecture Agency)

PC 레이아웃 섹션 상세 퍼블리싱(Project Section) - 프로토타입 제작 #02

input 태그와 label 태그에 관한 질문입니다

작성

442

안녕하세요 선생님

input 태그에 id를 설정하고 이를 label 태그의 for 속성으로 연결한다고 들었습니다.

그런데 input 태그를 그대로 사용하지 않고 굳이 display:none;으로 바꾼 다음 label 태그를 대용하는 이유는 무엇인가요?

퀴즈

프로젝트 섹션의 복잡한 UI를 개발할 때, 별도의 HTML 파일을 만들어 프로토타입을 먼저 제작하는 주된 이유는 무엇일까요?

최종 파일의 CSS 충돌을 방지하기 위해서입니다.

기능 개발에 집중하고 복잡성을 줄이기 위해서입니다.

자바스크립트 코드 작성을 미리 테스트하기 위해서입니다.

이미지 파일 로딩 속도를 최적화하기 위해서입니다.

답변 1

지식공유자

input의 id와 label의 for가 같다면 input과 label은 연결할 수 있습니다.

곧 input이 안보여도 label을 누르는 것이 input을 누르는 것과 같습니다.

input이 before after 가상클래스를 가질 수 있다면 위에 처럼 label을 사용할 필요가 없습니다.

하지만 input이 before after 가상클래스를 가질 수 없기 때문에 label을 사용합니다.

질문자

감사합니다!

작성한 질문수