<!Doctype html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Login Page</title>
</head>
<body>
<div class="login-wrapper">
<h2>Login</h2>
<form method="post" action="서버의url" id="login-from">
<input type="text" name="username" placeholder="Email">
<br>
<input type="password" name="userPassword" placeholder="Password">
<br>
<label>
<input type="checkbox" id="remember-check"> 아이디 저장하기
</label>
<br>
<input type="submit" value="Login">
</form>
</div>
</body>
</html>
아래의 이미지처럼 뜨는 것을 볼 수 있었다!
다음에는 회원가입 창을 만들어 보겠다!
필요했던 지식들
<div>/division(구획, 나누다) : 속성을 활용하기 위한 컨테이너. 특별한 의미를 가지고 있지는 않다.
<form> : 데이터를 제출하기 위한 웹 양식의 형태
method : 양식이 제출될 때 양식 영역의 데이터를 제출하는방법
action : 지정한 URL로 데이터가 전송된다.
id : 해당 요소의 고유식별자(ID, unique identifier)를 지정하는 속성. 이 속성의 값은 문서(웹페이지)에서 유일하고 고유해야만한다.
<input> : 사용자로부터 데이터를 입력받기 위한 대화영 컨트롤
placeholder : 문자나 이미지 등이 들어갈 자리에 임시로 채워놓는 내용물
<label> : 사용자 인터페이스를 제공하는 컨트롤 요소들의 label(이름표)를 나타낸다. 이 태그는 컨트롤 요소들과 함께 사용,
웹 접근성을 높이는 역할을 한다.