How TO-Login Form (로그인 폼 만들기)

w3schools의 JavaScript How To 예제 중 로그인 폼을 만들어보겠습니다.

https://www.w3schools.com/howto/howto_css_login_form.asp

How To Create a Login Form

Login Form을 진행하기에 앞서 이번 예제에서 필수적인 <form> 태그에 대해 설명하자면, 사용자가 로그인이나 회원가입, 물건 구입 등의 작업을 진행할때 사용자가 입력한 정보를 서버쪽으로 전송할때 사용합니다.

<form> 태그는 form요소를 감싸는 태그로 데이터를 묶어서 실제 서버로 전송해주는 역할을 하는 태그입니다.

- action 속성 : 폼데이터를 처리하기위한 서버의 주소

- method 속성 : 데이터를 전송하기위한 방식을 지정

     1. get 방식 : 데이터가 전송될때 주소창에 파라미터 형태로 붙어 데이터가 노출됩니다.

     2. post 방식 : 데이터가 전송될 때 데이터가 노출되지 않습니다.(보안)

 

https://nossodia.tistory.com/25

HTML_폼요소3 <label,fieldset,form></label,fieldset,form>

https://developer.mozilla.org/ko/docs/Web/HTML/Element/form

 

---

STEP1. 기본 로그인 폼 만들기

 

Example1. HTML 요소

 

 

Example2. CSS 요소 추가

 

 

LoginForm.txt

0.00MB

---

STEP2. 모달 로그인폼 만들기

 

Example1. HTML 요소 추가

 

Example2. CSS 요소 추가

 

Example 3. JavaScript 요소 추가

ModalLoginForm.txt

0.00MB