마크업 언어/HTML
-
[HTML] <input> 태그 속성 placeholder, required, autocomplete마크업 언어/HTML 2024. 1. 2. 18:22
1. 값이 비어있을 때 보여주는 값 placeholder 아래 구글 로그인 화면에 있는 "이메일 또는 휴대전화" 같은 건데요. 이런 걸 "플레이스홀더"라고 부릅니다. 이런 값을 추가하려면 placeholder라는 속성을 쓰면 됩니다. 이때 placeholder 의 디자인을 바꾸려면 CSS 선택자로 ::placeholder 를 활용하면 됩니다. input::placeholder { color: #dddddd; } 2.반드시 입력해야 하는 값 required 폼에서 반드시 입력해야 하는 값이 있다면 required 속성을 써주면 됩니다. 만약 required인 인풋의 값이 비어있다면, 전송 버튼을 눌러도 전송되지 않습니다. 3.자동 완성 autocomplete 이 속성을 지정해 두면 폼이 전송될 때마다 입력..
-
[HTML] <input>태그 종류마크업 언어/HTML 2024. 1. 2. 17:28
1. 체크박스 checkbox ▶ 한 항목만 선택하는 경우 아래 예시에서는 "동의합니다"에 체크하는 경우 agreement의 값이 on이라는 문자열로 지정됩니다. 동의합니다 ▶ 여러 항목 중에서 몇 항목을 선택하는 경우 태그에 value 속성으로 값을 지정해 주면, 선택된 항목의 지정된 값이 쓰입니다. 예를 들자면 아래 코드에서는 "액션"이랑 "코미디"를 선택했을 때 film의 값으로 action과 comedy라는 문자열이 지정됩니다. 폼을 전송했을 때 쿼리 문자열에서는 &film=action&film=comedy처럼 전송됩니다. 좋아하는 영화 장르 액션 코미디 로맨스 2. 날짜 date 선택한 날짜로 값을 지정할 수 있습니다. 3. 파일 file 파일을 선택하고 첨부할 수 있습니다. ▶ 파일 형식 지정..