액션은 목적지의 주소, 서버 주소 등 넣을수 있다.
메소드는 post / get / dialog
get은 url에 비밀번호 다 나와서 보완이 취약(post 사용해야 함)
다음 아래에 나오는 모든 것들은 form태그 안에 들어갈 수 있는 내용.
<form action="" method="get">
</form>
시맨틱 요소에서 label 좋다. 인풋 앞 태그에 사용 굿
<form action="" method="get">
<label for="food">음식 : </label> <input>
</form>
fieldset 폼요소 바깥으로 묶는. 그룹을 만들수 있는.
legend 그룹의 설명
<fieldset>
<legend> 범례1 </legend>
<form action="" method="get">
<label for="food">음식 : </label> <input>
</form>
</fieldset>
type text같은 데서,
minlength="1" 입력 가능한 최소 글자 수
maxlength="10" 입력 가능한 최대 글자 수
인풋 속성은 사용할때 그때그때 새롭게 검색하는게 굿
type="submit" value="제출하기"
<fieldset>
<legend> 범례1 </legend>
<form action="" method="get">
<label for="color">색깔 : </label>
<input type="text" name="color" >
</form>
</fieldset>
<input type="text" name="username" >
이런식으로 name속성 적으면 제출시 구분이됨.
autocomplete 는 양식을 자동으로 생성.
<input type="text" name="username" autocomplete="on">
인풋 누르면 과거에 썼던 부분 뜸, 과거값 후보로 뜨게함.
<input type="text" name="username" autocomplete="on" required>
required 넣으면 인풋에 필수로 적으란 의미.
<input type="text" name="username" autocomplete="on" disabled>
disabled 넣으면 인풋에 적지 못하게 되있음.
<input type="text" name="username" autocomplete="on" readonly>
readonly 마우스가 포커싱은 되는데 클릭시, 쓰라고 깜빡이진 않음.쓰지도 못함
즉, 읽기 전용이라는 것. 잘안씀;;
<input type="number" mix="0" max="100">
숫자 넣는 값 범위 설정.
즉, 유효성 검사가 가능하게 되~ email도 그렇고 ㅋ
<input type="range" mix="0" max="100">
range 태그는 퍼센트 바. 여기에 max min 속성+값 넣으면
그 값의 기준이 됨. 가장 낮은 값이 min값이 되고 큰값은 max
<button type="reset">초기화</button>
<button type="submit">전송</button>
<button type="button">빈 버튼</button>
select는 드롭다운. option는 select의 자식 태그
<form action="" method="get">
<label for="LovePets">키우는 동물 : </label>
<select name="pets">
<option value="">옵션을 선택해 주세요</option>
<option value="dog">강아지</option>
<option value="cat">고양이</option>
</select>
<input type="submit">
</form>
커서 hover시 화살표 생김.
누르면 주르면 후보 나옴.선택안하고 input에 마음대로 써도 제출가능.
앞글자에 빨만 써도 아래 빨강 추천뜸.
<form action="" method="get">
<label for="color-choice">좋아하는 색:</label>
<input list="colorList" name="color-choice" />
<datalist id="favoriteColor">
<option value="red">빨강</option>
<option value="yellow">노랑</option>
<option value="green"> 초록 </option>
</datalist>
<input type="submit">
</form>
rows는 보여줄수 있는 줄 수.그 이상은 스크롤
width도 되지만 rows를 많이 씀. 가로는 cols
<form action="" method="get">
<lavel for="comment">댓글 : </label>
<textarea name="comment" id="commnet" row="5">
추천 합니다. 미리 들어있는 글.
</textarea>
</form>
두고 두고 볼 수 있는 기초 지식ㅇ_ㅇ)!