목록html (4)

코딩헤딩

HTML, CSS로 반응형 UI 만들기 (입력값 검증, 가짜 로그인 처리, 로컬스토리지)

입력값이 비었는지 확인아이디/비밀번호가 맞는지 검사로그인 성공 시 다음 페이지로 이동실패 시 에러 메시지 출력사용자 이름을 로그인 시 넘겨받아 화면에 표시 # 로그인 화면* .HTML 코드 Login 👁️ 로그인 * .CSS 코드/* 공통 초기화 */ * { margin: 0; padding: 0; box-sizing: border-box; } body { height: 100vh; display: flex; justify-content: center; align-items: center; background: #f4f4f4; ..
HTML | CSS 2025. 8. 5. 21:27
HTML, CSS로 반응형 UI 만들기 (웹앱, 다크모드)

*주요 구현 내용반응형 너비width: 100%; max-width: 400px모바일 대응미디어 쿼리로 폰트/패딩 조절중앙 정렬flex 사용다크모드 대응prefers-color-scheme 사용디자인그림자, 버튼 호버, 둥근 모서리* .HTML 코드 Login 👁️ 로그인 * .CSS 코드 /* 공통부분 */ * { margin: 0; padding: 0; box-sizing: border-box; } body { height: 100vh;..
HTML | CSS 2025. 7. 30. 22:33
[java script] 랜덤 12자리 문자열 생성 (jQuery코드 추가)

12자리의 랜덤한 문자열 생성 후 input 태그의 value로 담기.1) html코드 랜덤 12자리 문자열 생성  2) 자바스크립트 코드function generateRandomString(length) { // 문자열에 포함 될 문자. const characters = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789'; // 생성될 문자열 변수 초기화. let result = ''; // 선언해놓은 문자열 중 랜덤한 문자 조합. for (let i = 0; i  2-1) jQuery코드// jQuery 사용을 위해 $(document).ready(function () { function..
javascript 2024. 12. 15. 21:17
[java script + CSS] 토글 드롭다운

* html F&Q ▶ 탑승 가능 인원 * 최대 4명 * 적재하시는 짐의 사이즈와 갯수에 따라 탑승 가능 인원은 줄어들며, 카시트 지참이 필요한 영유아도 인원수에 포함 됩니다. ▶ 요금 조정 및 환불 * 날다는 플랫폼으로 호출을 취소하는 경우 취소수수료가 부과됩니다. ≫ 출발 전일 15시까지 : 수수료 없음 ≫ 출발 전일 15시~자정 : 요금의 50% ≫ 출발 당일 탑승 4시간 이전 : 요금의 80% ≫ 출발 당일 탑승 4시간 전 이후 & 노쇼(30분 초과) : 요금의 100% * 다만 서비스를 이용하심에 있어, 문제가 발생하셨거나 요금 관련 조정이 필요한 부분이 있다면 [문의하기] 를 통해 남겨주세요. ▶ 반려동물 탑승 * 날다는 반려동물과 동반 탑승이 가능합니다. * 단, 반드시 전용 이동장(케이지)..
javascript 2024. 1. 22. 23:42
이전 Prev 1 Next 다음