form

Front-End/HTML&CSS

[HTML / 시맨틱 마크업] 폼 (Form) - Radio & Checkbox, Select & Option

Radio 📌 임의의 그룹 내에서는 여러 값 중 단 하나만 선택할 수 있다. 👉 name : name의 값이 같은 것 중 하나를 선택한다. 👉 value : 선택했을 때 전달될 값을 나타낸다. 👉 checked : 해당 버튼을 선택된 상태로 만든다. radio 버튼은 체크박스 버튼과 달리 선택을 해제할 수 없다. Checkbox 📌 사용자가 여러 선택 사항 중에서 하나 이상의 값을 선택할 수 있게 한다. 👉 name : 전달할 값의 이름을 나타낸다. 👉 value : 전달할 값을 나타낸다. value 속성이 생략된 경우 기본 값은 on이다. 👉 checked : 해당 버튼을 선택된 상태로 만든다. Select 📌 특성 multiple : 다수의 항목을 동시에 선택할 수 있도록 한다. (윈도우는 ctrl ..

Front-End/HTML&CSS

[HTML / 시맨틱 마크업] 폼 (Form) - 기본 구조, Input, Label

기본 구조 📌 사용자로부터 인풋(Input)을 받기 위한 태그 form 요소 스타일링 시 모든 elements의 유효성을 나타내는 CSS의 :valid와 :invalid 의사 클래스를 사용할 수 있다. 1) action (필수) 📌 action="API 주소" 해당 form을 처리할 로직이 있는 API의 서버 쪽에 접근 가능한 URL을 명시한다. , , 요소의 formaction 특성으로 재정의할 수 있다. [참고] formaction 이 제출 버튼인 경우, 제출한 정보를 처리할 URL을 명시한다. URL을 지정한 경우, 버튼의 양식 소유자가 가진 action 특성보다 우선한다. 양식 소유자가 존재하지 않으면 영향을 주지 않는다. 2) method (필수) 📌 method="GET | POST" 양식을 ..

Olivia Kim
'form' 태그의 글 목록