HTML (3) 썸네일형 리스트형 [html/css] 로그인 페이지 만들기2 글래스 느낌의 로그인 페이지 구현하기 01 예제 디자인 02 마크업 해보기 Good Morning Welcome back! 뒤로가기 Log in Email Password Remember ID Log in Forgot Password? Don't have an account? Sign up 03 CSS 적용하기 @import url('https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;700&display=swap'); * { box-sizing: border-box; padding: 0; margin: 0; } body { width: 100%; height: 100vh; font-family: 'Roboto', sans-serif; font-s.. [javascript]회원가입 페이지 구현하기 회원가입 페이지 구현하기 [Javascript] 구현할 내용 1. 핸드폰 번호 기입 시 자동으로 다음 칸 넘어가기 2. 핸드폰 번호 전체 기입 시 인증번호 전송 버튼 활성화시키기 / 토큰 생성 후 화면 표출 / 3분 타이머 시작 / 인증완료 버튼 활성화 3. 3분 이내 클릭 시 '인증 완료' alert 창 생성 / 3분 지나면 전체 초기화 4. 가입하기 버튼 클릭 시 전체 유효성 검사(오류 메시지 표출) 5. 검증 완료 후 가입 축하 메시지 alert 창 생성 1. 핸드폰 번호 기입 시 자동으로 다음 칸 넘어가기 1) 핸드폰 번호 칸 [3자리]-[4자리]-[4자리] 2) 핸드폰 번호를 담는 변수 3) input 안의 value값을 확인해서 자릿수 조건을 만족하면 다음 칸으로 이동 - 각 칸의 숫자의 길이.. [html]로그인 페이지 만들기-form, label, input 로그인 페이지 만들기 ※중요) 기억해야 될 태그 : type = "text", "password", "submit", "checkbox" 01 예제 디자인 02 예제 속 필요한 태그 알아보기 Login : Email 적는 칸 : Password 적는 칸 : 아이디 저장하기 : , login 버튼 : 03 마크업 해보기 Login 아이디 저장하기 1. 부모 태그 안에 태그를 자식으로 넣어 마크업 한다. 2. placeholder는 입력 필드에 사용자가 어떤 값을 입력해야 하는지를 간략하게 알려주는 역할을 한다. 단어 혹은 짧은 문구가 들어가며 사용자가 입력하는 즉시 사라진다. 3. 태그의 for=""와 태그의 id=""를 동일하게 적어 연결시켜주면, checkbox 혹은 '아이디 저장하기' 둘 중 아무거나.. 이전 1 다음
