본문 바로가기

공부/화면구현 UI

 (10)
7월15일 - JavaScript 6 학습1 UI 설계 -> 대분류 개념으로 지문을 읽어볼 것 학습2 UI 구현 -> 12_회원가입.html 철저히 분석할 것 객관식(20문제) 50점 개념 select element에서 일어날수 있는 event-> onchange 함수의 기능 객체가 해야하는 것 자바에서 숫자형태나 문자형으로 형변환 number, parseint html css 3school.com에 있는 문제로 냇움 2문제 글자갯수제한 보충설명 주관식(문제해결형) 50점 -> 1) 결과보고서.docx 작성해서 제출 (시연결과 캡쳐 + html문서) 2) .html 제출 사진스크롤 12장나오기 쫙 나열해놓고 보이는공간을 줄이는 것. JavaScript BOM The Browser Object Model (BOM) -> window, docu..
7월12일 - JavaScript 5 JavaScript 19. JavaScript Scope 자바 스크립트 변수의 유효범위 - Local scope : (지역변수) function내에 선언된 변수로 function내에서만 사용가능 - Global scope : (전역변수) function외부에서 선언된 변수로 모든 function에서 사용가능 전역변수는 전역적인 공간안에 있다면 전부다 사용이 가능하다. 자바스크립트의 유효범위(SCOPE) -> 각 버튼을 누르면 var- one two three의 정보가 다 나온다. 19. JavaScript setTimeout 부모랑 같이있는게 모달창 따로있는게 window창 *The Window Object 사이트 https://www.w3schools.com/jsref/obj_window.asp - 주..
7월11일 - JavaScript 4 JavaScript 13. JavaScript 연습문제2 로또번호 문제) 1~45중에서 서로 겹치지 않게 6개 발생시킨 후 오름차순으로 정렬해서 각 텍스트 상자에 출력하시오 로또번호 분석-> 로또번호 6개 나오는 for문에서 주의할 점, js에서의 정수형 전환표현은 parseInt로 쓴다. 로또번호를 출력하는 for문에서 주의할 점, 반대로 js에서의 정수형 표현은 자유롭다. 그러므로 n(x)의 x숫자를 idx로 줘서 식을 간단히 만들수 있다. 14. JavaScript THIS 15. JavaScript getElementById 1) id=mydiv에 접근 대한민국 2) id의 스타일 변경 대한민국 3) id의 이미지 변경 대한민국 16. JavaScript 마우스이벤트 KBS MBC SBS 해피투게..
7월10일 - JavaScript 3 JavaScript 10. JavaScript StringMethod 1. String Method var txt = "ABCDEFGHIJKLMNOPQRSTUVWXYZ"; document.write(txt.length+" "); //26 var str = "Please locate where 'locate' occurs!"; document.write(str.indexOf("locate")+" "); //7 document.write(str.lastIndexOf("locate")+" "); //21 document.write(str.lastIndexOf("John")+" "); //-1 document.write(str.indexOf("locate", 15)+" "); //21 document.write..
7월9일 - JavaScript 2 JavaScript 6. JavaScript Arrays (배열) - 배열이 있다는 것은 순서(index)가 있다는 뜻 - 자바의 배열과는 다르다. - 배열의 진화된 모습은 JSON이다. 1) 표현방법, element 요소, index 순서 //old version var points=new Array(40,100,1,5,25,10); document.write(points); //배열요소전체 document.write(""); document.write(points.length); //배열요소갯수 //new version var points = [40, 100, 1, 5, 25, 10]; for(idx=0;idx fruit[4] 의 배열의 요소는 존재하지않지만 요소의 갯수에는 포함이 되어있기에 unde..
7월8일 - JavaScript 1 UI 개발 도구 분류 - 화면설계할 시, 파워포인트 주로 씀. - 대강의 틀을 적을 시에 CSS Media Queries 웹-> 태블릿-> 앱 보이는 화면의 갯수 조정하는 거. https://www.w3schools.com/css/css_rwd_mediaqueries.asp Bootstrap - 트위터에서 개발한 UI 라이브러리 - 제일 많이 쓰는 유형의 앱 화면구현 JavaScript - 종류 : JS, jQuery, AJAX 등 - 위치 : 2) 변수의 자료형 var만 존재한다. - 값이 변수에 대입이 되면서 자료형이 결정된다. - 변수 선언하지 않아도 사용가능하다. 3) document 객체 - 웹페이지의 본문 가 가리키는 객체 *document object https://www.w3schools...
7월4일 - UI 구현 CSS CSS CSS Position https://www.w3schools.com/cssref/pr_class_position.asp 1) sticky : 창고정되어있는거. 스크롤을 내려도 위의 메뉴는 고정되어있다. 2) sticky와 fixed비교 3) static : 기본값 absolute : 절대적 위치 (0,0) 부모가 static 자식이 absolute 이면 자식은 기본의 기준에 맞춰 움직인다. 부모가 absolute 자식이 absolute 이면 자식은 부모의 기준에 맞춰 움직인다. relative : 상대적위치. 페이지의 흐름의 영향을 받아서 자연스런 배치가 된다. CSS Z-index -> 레이어순서 정하기 큰수가 위로 올라온다. CSS Media Queries ex) 만들기 *참조사이트 : ht..
7월3일 - UI 구현 HTML3 + CSS HTML 1. HTML FRAMESET 프레임분할 바디를 나누는 것이므로 는 지워야한다. 1) 가로로 나누기 cols 나머지 공간은 *로 표시한다. src : 문서연결 noresize : 여백조절불가능 -1) file. 15_Frameset.html -2) file. leftmenu.html * 관리자페이지 * ■ 솔데스크 ■ 다음 ■ 표 분석 -> 의 의미는 file15에 frame을 두개로 주었다. 메인과 sub. 메인에는 관리자페이지가 뜨게 만들고 옆의 sub에 관리자페이지의 페이지링크를 구현하게 하라는 뜻이다. 링크는 각 사이트의 링크뿐만 아니라 파일의 링크도 연결해올 수 있다. [웹의 3요소] - 웹표준 - 웹접근성 - 웹호환성 [웹표준의 3요소] - 구조 : HTML - 표현 : CSS - 동..

티스토리툴바