HTML12 HTML5 Tag-[사용자와의 커뮤니케이션을 위한 태그 3] <form> label tag 의미 및 특징 label form 요소(input, textarea, select)에 제목을 정의하는 태그 연결을 위해서 label태그 for 속성과 form요소의 id 속성 값을 동의하게 정의해야한다. ex) 아이디 form요소에 글상자나 버튼을 클릭하는게 아니라 label의 텍스트를 입력해도 동작이 되게 하기 때문에 사용자 측면에서 웹 접근성이 개선됩니다. 회원가입 입력 아이디 비밀번호 비밀번호 재입력 이메일 핸드폰 번호 선택010011 -- 회원가입 입력 아이디 비밀번호 비밀번호 재입력 이메일 핸드폰 번호 선택010011 -- 2020. 8. 1. HTML5 Tag-[사용자와의 커뮤니케이션을 위한 태그 2] <form> input 1. input 사용자로부터 데이터 값을 입력받기 위한 태그. type 속성 값에 따라 폼 컨트롤을 생성. type 속성 값 설명 text 한 줄 글 입력 상자. maxlength 속성으로 글자 수 제한 가능 password 비밀번호 입력 상자. 입력된 내용이 *로 표시된다. search 검색 입력 상자 date 년-월-일 선택 상자 datetime-local 년-월-일-시분초 선택 상자 month 년-월 선택 상자 week 년-주 선택 상자 time 시간 선택 상자 email 이메일 입력 상자 tel 전화번호 입력 상자 color 색상 선택 상자 number 숫자 선택 상자. min(최솟값), max(최댓값), step(선택 단계), value(시작값) 지정 가능 range 슬라이드바. min(최솟값).. 2020. 8. 1. HTML5 Tag-[사용자와의 커뮤니케이션을 위한 태그 1] <form> fieldset/legend, textarea, select 1. form 사용자가 입력한 데이터를 처리하는 프로그램으로 전송할 때 사용하는 태그 (사용자 입력 데이터 수집) 속성 설명 action 입력 데이터(form data)가 전송될 URL method 입력 데이터(form data) 전달 방식 method 속성 GET 방식 POST 방식 전송 URL 뒤에 데이터가 노출되기 때문에 주로 '검색'에 쓰임. URL 전송 데이터 노출되지 않지만 GET에 비해 속도가 느리다. 주로 '로그인', '회원가입'에 쓰임. 2. fieldset / legend : 양식 요소들을 그룹화 할때 사용 : 그룹화된(fieldset) 서식의 제목을 정의. form method get 방식 검색 : form method post 방식 ID : PW : fieldset/legend 로그.. 2020. 7. 31. HTML5 Tag-Table [표태그] * 주로 분할 태그인 div 태그를 사용하여 레이아웃을 구성. table 태그는 반응형 웹페이지 반영이 안 됨. tag 설명 table 표를 감싸는 태그 tr 표 내부의 행 (table row)_(th, thd 태그들을 가로로 묶는 행 그룹) th 행 내부의 제목 셀 (table heading)_(굵게, 가운데 정렬) td 행 내부의 일반 셀 (table data) 열의 요약 영역 (컨텐츠 그룹) 열 그룹 표의 머리(제목) 영역 표의 중간(본문) 영역 표의 꼬리(요약) 영역 서식화를 위해 복수개의 열을 그룹화 colgroup 요소 안의 각각의 열 속성 지정 속성 설명 width: 100% 표의 가로 길이를 100%로 표현. border-collapse: collapse 요소들(셀)의 위, 아래, 좌, 우.. 2020. 7. 29. 이전 1 2 3 다음