본문 바로가기
웹코딩 배우기/· HTML

HTML 입력 유형

by 닐기 2019. 10. 17.

<!DOCTYPE html>
<html>
<head>
	<title>문서 타이틀</title>
</head>
<body>
<div style="border: 1px solid #000; padding: 15px;">

<form>
	<p>▼버튼</p><input type="button">
	<p>▼체크박스</p><input type="checkbox">
	<p>▼색상</p><input type="color">
	<p>▼날짜</p><input type="date">
	<p>▼날짜와 지역</p><input type="datetime-local">
	<p>▼이메일</p><input type="email">
	<p>▼파일</p><input type="file">
	<p>▼숨김</p><input type="hidden">
	<p>▼이미지버튼</p><input type="image">
	<p>▼월</p><input type="month">
	<p>▼번호</p><input type="number">
	<p>▼비밀번호</p><input type="password" name="psw">
	<p>▼라디오버튼</p><input type="radio">
	<p>▼입력 범위</p><input type="range">
	<p>▼입력값 기본으로</p><input type="reset">
	<p>▼검색</p><input type="search">
	<p>▼제출</p><input type="submit">
	<p>▼전화번호</p><input type="tel">
	<p>▼입력필드</p><input type="text">
	<p>▼시간</p><input type="time">
	<p>▼url</p><input type="url">
	<p>▼주</p><input type="week">
</form>
</div>
</body>
</html>

▼버튼

▼체크박스

▼색상

▼날짜

▼날짜와 지역

▼이메일

▼파일

▼숨김 - type="hidden"

▼이미지버튼

▼월

▼번호

▼비밀번호

▼라디오버튼

▼입력 범위

▼입력값 기본으로

▼검색

▼제출

▼전화번호

▼입력필드

▼시간

▼url

▼주

  • <input type="button">
  • <input type="checkbox">
  • <input type="color">
  • <input type="date">
  • <input type="datetime-local">
  • <input type="email">
  • <input type="file">
  • <input type="hidden">
  • <input type="image">
  • <input type="month">
  • <input type="number">
  • <input type="password">
  • <input type="radio">
  • <input type="range">
  • <input type="reset">
  • <input type="search">
  • <input type="submit">
  • <input type="tel">
  • <input type="text">
  • <input type="time">
  • <input type="url">
  • <input type="week">