4.1 변수 변수는 하나의 값을 저장하기 위해 확보한 메모리 공간 자체 또는 그 메모리 공간을 식별하기 위해 붙인 이름을 말한다. 컴퓨터는 연산과 기억을 수행하는 부품이 나눠져 있다. 컴퓨터는 CPU를 사용해 연산하고, 메모리를 사용해 데이터를 기억한다. 메모리는 데이터를 저장할 수 있는 메모리 셀의 집합체다. 메모리 셀 하나의 크기는 1...

SVG(Scalable Vector Grapics) SVG(Scalable Vector Graphics)는 2차원 벡터 그래픽을 서술하는 XML 기반의 마크업 언어이다. SVG는 텍스트 기반의 열린 웹 표준 중 하나로, 모든 사이즈에서 깔끔하게 렌더링 되는 이미지를 서술하며 CSS, DOM, JavaScript, SMIL, (en-US) 등 다른 ...

브라우저 객체 모델 (Browser Object Model : BOM) 실제 우리가 사용하고 있는 브라우저와 관련된 객체의 집합이다. 대표적으로 window(최상위 객체), location, navigator, history, screen, document 객체가 있다. window 객체 구조도 location Object: 웹 링크, ...

skip navi란? 사용자 편의 및 웹 접근성향상을 위한 skip navi를 body 최상단에 넣어준다. 마우스나 키보드를 사용하지 못해 tab키를 사용해야 하는 사용자에게 사이트 최상단에 바로가기를 만들어 줌으로써 원하는 영역에 바로 갈 수 있게 도와주는 기능을 한다. 사용예제 <div id="skipNav"> <a hr...

CSS3 animation CSS의 속성을 이용하여 애니메이션을 표현할 수 있다. CSS3 애니메이션은 엘리먼트에 적용되는 CSS 스타일을 다른 CSS 스타일로 부드럽게 전환시켜준다. 애니메이션은 애니메이션을 나타내는 CSS 스타일과 애니메이션의 중간 상태를 나타내는 키프레임들로 이루어진다. 장점 CSS 애니메이션은 기존에 사용되던 스크립트를...

open graph 태그란? 페이스북이나 네이버 블로그, 카카오톡 등에서 링크를 공유하면 자동으로 링크에 대한 미리보기 제목, 설명, 이미지를 제공하게 되는데, 이를 제어할 수 있는 태그 오픈그래프 프로토콜은 페이스북에 의해서 처음 만들어 짐 오픈그래프는 HTML문서의 메타정보를 쉽게 표시하기 위해 만들어짐 메타정보에 해당하는 제목,...

CSS3에서는 선택자 속성이 새롭게 추가되었다. selector를 사용하게 되면 id나 class를 대폭 줄일 수 있는 장점이 있다. 유사클래스 네임 (해당 문자를 포함하는 클래스 명) <div class="box1"> <ul> <li class="hana dul set">배분 대표사업의 핵심 브랜드화&...

input 요소 HTML5 에서는 강력한 form 속성을 지원한다. 때문에 어려운 스크립트 없이도 다양한 ui를 표현할 수 있다. 이메일 입력을 위한 email <input type="email" value="some@email.com"> 리소스 주소 입력을 위한 url <input type="url" name="user_u...

객체는 세상에 존재하는 모든 것이다. 자동차 객체의 모델링 객체 car 속성 car.nave = "Sonata" car.speed = 100 car.color = "White" car.door = 4 메소드 car.s...

함수 선언과 호출 형식 function 함수명(매개변수1, 매개변수2, ···){ //함수선언 실행 문장; return 반환값; } 함수명(인자1, 인자2, ···); //함수 호출 인자: 함수를 호출할 때 전달하는 입력값 매개변수: 함수 호출문에서 전달한 인자를 받기 위해 선언된 변수 function: 함수를 선언할 때 사...