목록2026/03/11 (4)
無제
🔵 태그의 type 속성 🔸 텍스트 및 정보 입력 타입가장 기본적인 형태로, 특정 형식의 텍스트를 입력받을 때 사용한다.text: 일반 텍스트 입력칸.(한 줄)password: 입력 텍스트 숨김. (*, ●로 가려져 보인다.)search: 검색어 입력창. (일부 브라우저는 입력 필드 안에 ‘×’ 버튼을 자동으로 표시해 텍스트를 쉽게 지울 수 있게 한다.)url: URL 형식 자동 검사.email: 이메일 형식 자동 검사.tel: 전화번호 입력창. (모바일 기기에서 숫자 키패드를 띄우는 용도로 주로 사용) 🔸 선택 타입 (Check & Radio)여러 옵션 중 하나 또는 여러 개를 선택할 때 사용한다.checkbox: 여러 개를 동시에 선택할 수 있는 체크 박스.radio: 여러 개 중 하나만..
🟦 Input Tag 사용자로부터 데이터를 입력받는 요소로 동작과 제약의 조건을 세밀하게 제어한다. 👉🏻 닫는 태그가 없는 빈 태그(Empty Tag) 🔵 핵심 속성 4가지 🔸 autofocus (자동 포커스)페이지 로드 시 해당 입력 칸에 커서를 자동으로 위치시키는 기능.설명: 사용자가 페이지를 열자마자 바로 입력을 시작할 수 있게 한다.특징: 한 페이지에 하나의 요소에만 적용 가능. (로그인 페이지의 아이디 입력창 등에 주로 사용) 🔸 placeholder (안내 문구)입력하기 전, 입력 칸 안에 안내 문구를 보여주는 기능.설명: 입력창의 용도를 직관적으로 전달하며, 입력이 시작되면 자동으로 사라진다.주의: placeholder는 보조 수단일 뿐, label 태그를 대신할 수 없다...
🔵 핵심 속성 action: 데이터를 전송할 서버의 주소. (URL)특징: 생략 시 현재 페이지의 URL로 데이터를 다시 전송. method: 데이터 전송 방식.get: 데이터 조회˙전달에 적합, URL 쿼리스트링(?name=value) 형태로 값을 전달한다. (데이터 용량이 제한적이고, 보안이 중요하지 않을 경우 사용)post: 데이터 전송˙저장에 적합, 본문에 값을 담아 전달한다. (데이터 용량 제한이 거의 없고, 보안이 필요한 경우 사용) name: 선택한 값이 서버로 전송될 때 사용할 이름으로 서버에서 해당 이름으로 값을 조회. (이름=값)주의: 태그에 name 이 없으면, 해당 칸에 입력한 내용은 서버로 전송되지 않는다. target: 데이터를 전송할 창 지정._self: 현재 창에서 응답 ..
🟦 Form Tag사용자가 입력한 값을 서버로 전송하는 양식의 시작점으로, 입력요소를 묶어 제출(전송) 구조를 만든다. 🔵 구성 요소 5가지 🔸 폼 전체를 감싸는 컨테이너. 🔸 , 구조적으로 묶고 의미를 부여하는 역할.: 관련된 입력 요소들을 하나의 그룹으로 묶는 태그. (기본적으로 박스 모양 생성): 의 제목(캡션) 역할 태그. ( 안에서 가장 첫 번째 요소로 사용.) 🔸 , 입력과 접근성을 담당하는 중요한 요소.: 입력 요소(input)의 설명(라벨)을 붙이는 태그. 아이디: : 사용자가 라벨을 클릭하면 해당 입력칸이 자동으로 선택되어 편리.: 한 줄 이상의 텍스트 입력 필드.row: 세로 줄 수. (열)cols: 가로 글자 수. (칸)placeholder: 안내 문구.maxlengh..