전체 글
-
2020.11.09 #TILTIL(today I learned) 2020. 11. 10. 09:09
학원에서 마우스 오버시 전체가 내려오는 2단 메뉴 만드는 법을 배웠다 새롭게 알게된 점은 2단계 위에 있는 부모에 position: relative를 주면 2단계 하위의 자손 width가 relative를 따라간다는 것이다. 그리고 서브메뉴가 내려올때 배경 100%는 동일한 배경색의 shadow 박스를 만들어서 ul과 함께 내려오게끔 하면 된다. 어제 2단 메뉴로 동부센트레빌과 경기콘텐츠진흥원의 메뉴 부분을 만들었다. 1. 경기콘텐츠진흥원 HTML LOGIN JOIN 분양안내 분양캘린더 분양정보 현장안내 공사단지 정보 입주단지 정보 입주안내 입주가이드 중도금납부조회 입주예약 고객서비스 A/S센터 고객문의 브랜드 센트레빌 센트레빌 아스테리움 단지갤러리 수상실적 센트레빌 소식 CSS *{ margin: 0;..
-
2020.11.03 #TILTIL(today I learned) 2020. 11. 4. 14:34
오늘 학원에서 iframe을 배웠다. 처음 배우는 거라서 신기하고 재밌었다. 그리고 국회도서관 홈페이지를 만들었다. 저녁에는 자바스크립트 반복문의 효용성과 제어, 중첩사용과 함수의 형식과 효용에 관해 공부했다. iframe - 외부 링크나 파일, html을 불러오는 기능 - html에 작성 - facebook의 경우 developers.facebook.com/docs/plugins/page-plugin/ 에서 링크 복사 가능 *작성법* 1. javascript 반복문 1) 반복문의 효용성 - 반복문이 없다면? 'coding everybody'를 10번 출력하고 싶을때, document.write('coding everybody');를 10번 copy & paste 해야한다 10번의 copy & paste..
-
2020.11.02 #TILTIL(today I learned) 2020. 11. 3. 09:22
오늘은 조건문을 복습하고 논리연산자와 반복문 while과 for를 배웠다. 1. javascript 조건문 1. 논리연산자 1) &&(and, 그리고) : 좌항과 우항이 모두 true(참)일때 참이 된다. ① if(true&&true){alert(1);} //실행 ② if(true&&false){alert(2);} //실행X ③ if(false&&true){alert(3);} //실행X ④ if(false&&false){alert(4);} //실행X ex) var id = prompt('아이디를 입력하세요'); var pw = prompt('비밀번호를 입력하세요'); if( id=='egoing' && pw===1111){ alert('로그인 되었습니다'+id+'님 반갑습니다'); }else{ alert..
-
2020.10.28 #TILTIL(today I learned) 2020. 10. 29. 09:28
오늘 학원에서 2depth menu를 만들고 header영역을 position으로 배치하는 것을 위주로 공부했다. 그리고 저녁시간을 이용해서 자바스크립트 변수 기초를 공부했다. 1. Javascript 변수 1. 변수의 사용법 - 변수 : variable, 문자와 숫자를 담는 container로 값을 유지할 필요가 있을때 사용함.(문자와 숫자와 같은 담는 값은 변경될 수 있음) - var : 변수를 선언하겠다는 것을 의미, 생략 가능함 ex) var a = 1; a라는 이름을 가진 변수를 생성했음을 의미함. var를 생략할 때는 왜 생략하는지 이유를 명확히 알면 생략하고 만약 명확히 알지 못하면 생략하지 않는 것이 좋은 코딩을 위해 좋음 - var a=1; alert(a); a를 1이라는 변수라고 선언했..
-
2020.10.27 #TILTIL(today I learned) 2020. 10. 28. 00:12
오늘은 input과 table요소에 대해 어제보다 좀 더 진도를 나갔다. 나는 한번 공부한 내용이라 이해가 쉬웠다. table요소로 이력서 form도 만들었다. 저녁에는 js의 수의 표현에 대하여 공부하고 집와서 css로 상품이미지 띠 만들기와 y축 가운데 정렬하는 법에 대한 강의를 보았다. 1. javascript 수의 표현 1. 숫자와 문자 - data는 정보이며 정보는 type에 따라 다르다. 숫자, 문자 등 - alert(1); 에서 ()안에 숫자 또는 "문자"를 넣을 수 있음 - -1, -2, 0, 1, 2 ...와 같이 소숫점 없는 것은 정수, 1.1, 2.35와 같이 소숫점이 생기는 것을 실수라고 하는데 js에서는 정수, 실수 모두 사용가능하다. - [+ * / -]로 사칙연산이 가능하다 -..
-
2020.10.26 #TILTIL(today I learned) 2020. 10. 27. 00:00
오늘 학원에서 3가지의 section을 만들었다. 이제 시험도 끝나고 코딩에 집중할 수 있어서 너무 좋았다. 예제 더 많이 만들어보고싶다. 그리고 input요소와 visibility라는 css 명령어도 배웠다. visibility는 hidden; visible; inherit; 등의 속성값을 사용할 수 있는데 hidden은 display: none;과 비슷하지만 레이아웃에 영향을 끼치지 않는다는 차이점이 있다. 아 cursor라는 명령어도 배웠는데 마우스 커서의 모습을 바꿔준다. pointer; move; auto; text; 등의 값을 쓸 수 있다. 그리고 저녁시간에는 자바스크립트 기초 공부를 시작했다. JS가 무엇인지, 언어와 환경의 구분과 줄바꿈, 여백과 같은 기초적인 부분을 배웠다. 내일은 숫자와..
-
2020.10.22 #TILTIL(today I learned) 2020. 10. 22. 19:46
오늘은 학원에서 section 위주로 마크업과 css를 만들었다. 같이할땐 쉬웠는데 역시 혼자하려니 조금 답답했다. 그리고 텍스트 말줄임표 생성하는 법을 배웠다. text 말줄임표 만들기 1. 만들고자 하는 텍스트의 블록에 width 값이 설정되어 있어야함 2. text-overflow: ellipsis; white-space: nowrap; 작성 개인 공부로 이번주에 우리은행 시니어플러스 index페이지를 풀로 만드는 것이 목표이다 오늘은 header부분을 30% 만들었다 주말까지 해서 완성해야지 1. section 만들기 HTML 학습자료 안내 NE능률 도서의 모든 학습 자료가 한곳에! 모든 자료를 보고 싶으신가요? 학습자료실 바로가기 찾으시는 교재가 있으신가요? 스마트 검색 바로가기 브랜드 SNS ..
-
2020.10.21 #TILTIL(today I learned) 2020. 10. 22. 19:38
오늘은 학원에서 블럭요소 hover시 이미지가 변경되는 방법 5가지를 배웠다. 이렇게 배운건 처음이라 새롭고 재밌었다 1. HTML에서 script 사용하기 HTML 예제2 * onmouseover="this.src='images/bw1.jpg'" / onmouseout="this.src='images/woman1.jpg'" * 자바스크립트 사용해서 바꿀 수 있음 2. margin과 overflow 활용 HTML 예제3 CSS .bigbox > div{ margin: 20px 0 0 35px; width: 200px; height: 150px; border: 1px solid #333; float: left; } .bigbox .cbox{ overflow: hidden; } .bigbox .cbox im..