728x90
반응형

공부/[2019] 웹 프로그래밍 13

웹 프로그래밍 과제 : 웹사이트 제작

서버 연결 실패로 인한 html 파일로 제출하였다. ㅂㄷㅂㄷㅂㄷㅂㄷㅂㄷ 페이지가 시작하면 입력을 받는다. 1를 입력하면 그 다음 페이지에 나오는 이미지가 안 뜬다. 그 외에는 수는 일반적인 페이지로 작동한다 이름과 별명을 입력받을 수 있다. 사이트 시작을 누르면 애니메이션 효과를 받으면서 넘어간다. 일반적인 페이지, 페이지 구상을 고민하다가 고민만 하다가 대충했다. 슬프다 메뉴 마우스올리거나 나갈 때 변함. 이미지 표시 변경 누르면 사진이 나오고 없어지고 함. 그 밑에는 방학 계획이니 뭐시기 있음. CSS 꿀잼 div 천국 jQuery 이용 스크린샷에 빠진 코드들도 있긴한데, 히히 jQuery로만 이용하라고 해서 하다가 입력 양식 태그로 입력받은거를 받고 어쩌구하는게 잘 안되서 문서객체모델 섞었다..ㅎ

웹 프로그래밍 및 실습 시험공부 (입력 양식 태그, javascript(jQuery) 이벤트, Node.js+어쩌구저쩌구)

어쩌구 저쩌구.. pdf 파일 위주로 잘 보기 (주관식 비교 준비하기) var, let 비교 자바스크립트 응용 선택정렬.feat javascript // jQuery 이벤트 응용 function buttenClick() { alert('click'); } -> 함수 생성 버튼 ->함수 부르기 (문서객체모델) 표준 이벤트 객체 -> 여러 개의 함수 가능 (필요에 따라 교체 가능) function F1, F2, F3 Sel.addEventLister("onclick"); "F1()" // jQuery 함수에 기능을 파라미터처럼 넣음 on() - 이벤트 연결 off() - 이벤트 제거 Sel.click(), dbClick(), ~~(); -> 한눈에 보기 힘듦, 코드에러문제 -> 보완 Sel.on ( ); f..

[웹 프로그래밍] 자바스크립트 시험공부 실습위주..(문서 객체 모델, jQuery 라이브러리)

pdf 파일 정독정독정독 하기 문서 객체 모델과 jQuery 같이 공부 문서 객체 모델(DOM) (자바스크립트 자체가 어떤 애들이 어떤구조로 가지고있는가를 파악하기 쉽도록~ ) ? 태그가 정상적으로 작동하려면 속성이 필요함 document.getElementByld(아이디)에서는 #를 붙이지 않는다. "div" 맨 첫번째꺼만 적용 (#id, .class, tagN) 제한적 changed로 변경 가능 배열로 가능 ~All 전부다 선택 textContent와 innerHTML의 차이점 주소변경가능 새 창 열기 문서 객체 조작 중 jQuery 라이브러리 사용 일반 문서객체모델에서는 _이 에러를 먹는다 그래서 backgroundColor 이렇게 그런데 jQurey는 노상관 (여기서 선택자는 다 써줘도 된다고 함..

[웹 프로그래밍] 자바스크립트 ( 익명함수, 콜백함수)

ps. 예제 스크린샷을 올리는 용도입니다. 익명함수 funtion () {}; 선언적 함수 function 함수 () { }; 메모리공간 확보(형식 저장) var f1 = function(){...}; f1(); 변수는 바뀔 가능성이 있음 대신 지금은 일단 f1이라는 함수를 선언하고 나중에 바꿀수 있게~... 자주 쓰이지 않는 함수는 이름을 X (function () {} ) () ; (function (param) { } ) (45); (function (param) { } (45) ); 바로 실행하지 않으면 변수에 넣어줘야함 +함수) -> 변수접근 +함수(); -> 함수접근 ! 실행 우선순위 참고하기 // 입력 출력 변수취급 변수와 함수의 우선순위 -> 메모리안에 저장된 것이 어떻게 바뀌는지 생각하기..

[웹 프로그래밍] 자바스크립트 기본(중에서 일부)20190516

문장 마지막에 ; 세미콜론 찍어 종결 여러가지 키워드가 존재(pdf 파일 참조) -> 변수나 함수이름으로 하면 안됨 숫자로 시작X, 공백입력X, 특수문자는 _과 $만 허용 생성자 함수의 이름은 항상 대문자로 시작 변수, 인스턴스, 함수, 메소드의 이름은 항상 소문자로 시작 여러 단어로 된 식별자는 각 단어의 첫 글자를 대문자로 함 alert(); / ('i'+i) console.log(); / ('i',i) 형변환 우리 맘대로 X typeof -number, string, boolen number -> string : string(num); string -> number : number(str); parseInt(str,radix) 2 -> 36 parseFloot(str ) -> 응용하기 m = par..

웹 프로그래밍 및 실습 복습 (CSS3의 display 속성, 글자 속성, 위치 속성, 웹폰트)

display 속성, 배경 속성, 글자 속성, 위치 속성, float 속성, 그림자 속성, 그레이디언트 등 많음. 수업시간에 했던 코드 위주로 첨부, 자세한 복습 공부는 pdf 파일 참고하기! display 속성 display : ~ ; 로 사용 none : 태그를 화면에서 감추기 block : 태그를 블록 형식으로 지정 inline : 태그를 인라인 형식으로 지정 inline-block : 태그를 인라인-블록 형식으로 지정 블럭은 자동으로 줄바꿈이 됨 패딩이나 마진 지정하면서 예제 공부하기 수업시간 예제로 만듦 글자 속성 font style / italic 기울임 상황에따라서 글꼴이 흘림체로 변해서 기울어짐. obligue 기울어짐 경사 . 글자가 있었는데 글자의 형태를 유지하면서 기울어짐 normal..

[웹 프로그래밍] 시험공부 끄적끼적! (복습 및 추가)

글자 모양 태그만 사용하면 인라인 형식이 됨. 오디오도 같은데 이거 하기전에 컨트롤스나 포스터 넣어도됨. 테이블 태그와 CSS3 후손 선택자 사용 시. 자손 선택자 thead 사용 웹브라우저에서 자동적으로 티바디를 하므로 자손선택자를 사용하지 않는 것이 좋아보임 부정 선택자 응용 클래스는 . 아이디 태그와 자손선택자 아이디태그와 후손선택자 ,와의 관계 CSS 우선순위 1. 뒤에 나오는 CSS 2. 속성 값 뒤에 !important를 붙인 속성 3. html에서 style을 직접 지정한 속성 4. 아이디 선택자로 지정한 속성 5. 클래스 선택자로 지정한 속성 6. 태그 선택자로 지정한 속성 7. 우선순위가 같다면 속성 개수가 많은 CSS 동일한 속성이 아닐 경우, 먼저 정의된 속성은 유지됨. ///

[2019.04.18] 웹 프로그래밍 및 실습 복습 (CSS3의 다양한 선택자02, CSS3 박스속성)

동위 선택자 : 선택자 + 선택자 (얘만 찾을거야!) (동일한 레벨/같은 선상) 선택자 ~ 선택자 (전부다~~) 링크선택자 : 앞에 누군가가 붙어야 사용 가능. (a 태그) :link { } :visited {} 방문하고 나면. 동위 선상의 p 한개 링크 색 바꾸기 방문한 링크 색 바꾸기 부정 선택자 선택자:not(선택자) 아이디태그나 클래스태그가능 문자 선택자 ::first-letter 첫번째 글자 ::first-line 첫번째 줄(화면기준) ::after ::before ::selection 드래그 content : " " ; 필수! CSS3속성 단위 width : 100px, %, 1.8em(배율) color : red / #000000 / rgb(0,0,0) / rgba(0,0,0,1.0) 불투명..

[2019.04.11] 웹 프로그래밍 및 실습 복습 (CSS3의 다양한 선택자01)

CSS3 선택자 : 특정한 HTML 태그를 선택할 때 사용. 기본선택자 (다른 것들을 이용해서 다른 애들을 꾸며라 / 중복사용가능) - 전체 선택자 * (제일 우선순위 낮음) - 태그 선택자 - 아이디 선택자 - 클래스 선택자 예제중심 시자ㅏ아악 선택자 중복활용 속성 선택자 값 = 거의 문자열 포함을 의미하는 속성 선택자 1. 선택자[속성~=값] 분리가 되어있어야함 "t t1" 2. 선택자[속성*=값] 포함 id = "t2t"일지라도 시작과 끝을 의미하는 속성 선택자 3. 선택자[속성 |= 값] 시작) 단어 사이가 - 연결이 되어~ 4. 선택자[속성 ^= 값] 시작) 처음이 t1 (공백X) 5. 선택자[속성$=값] 끝) t1으로 끝나면 ~파일 확장자 할 때 잘 사용 후손 선택자와 자손 선택자 (div 밑..

[2019.04.04] 웹 프로그래밍 및 실습 복습 (Html5 멀티미디어태그, CSS3 기초)

HTML5 멀티미디어 태그(비디오&오디오) MIDI : 작곡가, 악기소리 RealAudio : 압축률 굿 (압축잘함) - 음질이 떨어짐 / 추가적인 플러그인 설치 필요 WMA : 오디오형 포맷, 플러그인 상 제공, 압축률 ㄱㅊ AAC : 아이폰, 아이튠즈 / 음질, 압축률 다 좋 WAV : 비압축 파일, 용량 큼 그 외. Ogg, MP3, MP4 wav -> 웹에서는 음악이 쓰이기 어렵대(용량이 큼) -> RealAudio, WMA, AAC WAV + MP3 = 기본으로 웹브라우저 지원 용량 큼 + 음질 떨 = 다른 포맷 사용하자! -> MP4, Ogg (고음질) -> 웹 브라우저마다 지원하는 오디오 형식이 다름 그래서 오디오형식을 고려해서 웹페이지를 만들어야함. src = " " 필요 / 음악 파일의 ..

728x90
반응형