html, javacript8 [HTML][display속성] span 과 div의 차이 태그와 태그는 영억을 설정 할 때 사용되는 태그이다. 웹 페이지에서 레이아웃을 구성할 때 꼭 필요한 태그들이다. 이 두 태그의 차이는 display 속성이 다르다는 것이다. 태그의 display 속성은 inline 이고 태그의 display 속성은 block 이다. 그럼 display 속성에 대해 알아보자. display 속성은 요소를 어떻게 보여줄지를 결정한다. 주로 4가지 속성값이 쓰이는데, 태그마다 기본값이 다르다. none : 보이지 않음 inline : 인라인 박스 block : 블록 박스 inline-block : block과 inline의 중간 형태 none 요소를 렌더링하지 않도록 설정한다. visibility 속성을 hidden으로 설정한 것과 달리, 영역도 차지하지 않는다. inline.. 2020. 7. 11. [HTML][Java Script] 회원가입 폼 - 유효성 검사 회원가입을 할 때 각 항목이 올바른 형식인지 검사를 한다. 이러한 유효성 검사 기능을 자바스크립트와 html로 구현해 보았다. 각 항목별 유효성 검사는 아래와 같은 기준으로 하였다. 유효성 검사 기준 아이디 : 4~12자 숫자와 영어 대소문자문 가능 비밀번호 : 4~12자 숫자와 영어 대소문자문 가능 비밀번호 확인 : 비밀번호와 같은지 확인 메일주소 : @이가 있는지와 .com .kr 로 끝나듯이 끝자리에서 2~3번째에 .이 있어야 한다. 주민번호 : 주민번호 계산식으로 확인 주소 : 다음 postcode로 입력 받는다. 생일 : 주민번호가 맞으면 자동으로 입력 관심분야 : 적어도 1개가 선택 되어야 한다. 본래 유효성 검사는 주로 자바스크립트로 이루어지지만 html5에서 pattern 기능이 추가되어 .. 2020. 7. 5. [HTML] 회원가입 폼 만들기 HTML의 from 과 input 기능을 가지고 회원가입 폼 만들기 회원가입 폼에 정보를 쓰고 회원가입 버튼을 누르면 mail 로 보내게 작성 하였다. 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 1.. 2020. 7. 4. [HTML][Java Script] 배열 메소드 (push, pop, shift, sort, reverse) 자바 스크립트의 배열 메도르를 가지고 배열에 값을 넣고 빼고 정렬을 해보기 자바스크립트의 배열 메소드 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 var arr = new Array(); function show(){ //배열 보여주기 var view= document.getElementById('viewer'); view.innerHTML=arr; } function push(){ //push 배열 뒤로 집어넣기 var num = document.getElementById('num').value; arr.. 2020. 7. 4. [HTML][Java Script] 현재시간 출력하기 자바스크립트에서 Date()로 시스템의 시간을 받아올 수 있다. 또한, Date()가 가지고 있는 getHours, getMinutes, getSeconds 메소드를 이용 하여 시간, 분, 초 의 정보를 받아올 수 있다. Date()로 시간을 받고 현재 시간의 시,분,초 로 나타내고 시간을 기준으로 오전과 오후로 나누어 보았다. 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 #divClock{ font-size: 30px; color: green; } function showClock(){ var currentDate = new Date(.. 2020. 7. 4. [HTML] CSS, 자바스크립트 외부에서 호출하기 HTML 파일 내부의 에 css와 javascript를 입력할 수 있지만 프로그램을 작성하다보면 코드가 너무 길어진다. 따라서, 프로젝트의 규모가 클 경우 css와 javascript를 외부에서 호출하여 사용한다. 외부 css파일 가져오는 방법 외부 스크립트를 가져오는 방법 2020. 7. 4. 이전 1 2 다음
