html) input, form

<!-- input type Ex) -->

<input type="text" /><br />

<input type="date" /><br />

<input type="color" /><br />

<input type="file" /><br />

<input type="checkbox" /><br />

<!-- input 태그의 type 은 매우 다양하다 -->

<!-- https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input-->

<!-- 위 주소에 가면 모든 가능한 type이 나온다-->

<br/>

<br/>

<!-- form Ex) -->

<form action="" method="get">

<!-- action에 빈 주소 값이면 해당 페이지(form 태그가 있는 페이지)로 전송 -->

<label for="username">Username:</label>

<input id="username" name="id" type="text" placeholder="enter you id"

required="true"/><br />

<label for="password">Password:</label>

<input id="password" name="pwd" type="password" placeholder="password"

pattern=".{5,10}" required title="enter 5 ~ 10" /><br />

<!-- pattern에서는 꼭 형식을 따르도록 한다 ".{5,10}"의 경우 5자 이상 10자 이하이며-->

<!-- required title은 이 조건이 만족되지 않았을 시에 뜰 안내 멘트이다-->

<label for="eamil">Email:</label>

<input id="email" name="email" type="email" required="true"/><br />

<label for="dog">Dog:</label>

<input name="pet" id="dog" type="radio" value="DOG"/>

<label for="cat">Cat:</label>

<input name="pet" id="cat" type="radio" value="CAT"/><br />

<select name="mood">

<option value="happy">:)</option>

<option value="neutral">:|</option>

<option value="sad">:(</option>

</select><br />

<textarea name="selfintro" id="selfintro" rows="20" cols="50"></textarea><br />

<button type="submit">submit</button>

</form>

<!-- required는 ="true" 가 없이 'required'만 있어도 true로 인식된다-->

<!-- 각 태그의 value가 form에 의해 넘어가기 위해서는 name attribute이 필요-->