목록분류 전체보기 (18)
WJ
SCOPE 란 ?SCOPE (스코프)는 직역하면 영역, 범위라는 뜻을 가지고 있습니다. Javascript 안에서의 스코프는 변수와 매개변수의 유효범위를 나타내며 변수가 정의 될때 변수의 위치에 따라 전역 범위(Global Scope), 지역 범위(Local Scope) 로 나뉘어 집니다. Global Scope 는 전역 범위로 전역 범위에서 선언된 변수는 코드 어느 곳에서도 참조하여 사용 할 수 있습니다. Local Scope 는 지역 범위로 지역 범위에서 선언된 변수는 선언된 함수 내부안에서만 참조하여 사용 할 수 있습니다. 함수 외부에서 선언된 변수는 전역 스코프로 불리며 함수 외부에서 선언한 변수 global_scope는 local 함수 내에서도 불러 사용 할 수 있습니다. 하지만 local 함수..
css3에서는 @keyframes을 통해 다양한 애니메이션 효과들을 만들 수 있습니다. @keyframes 을 통해 애니메이션 효과를 만들기 위해서는 from(0%) 과 to(100%) 값이 반드시 필요합니다. 또한 퍼센트를 통해 애니메이션 중간중간 다양한 효과들을 나타낼 수 있습니다. 예를 들어 @keyframes move{ 0%{top:0; left:0;} 25%{top:50px;} 50%{top:100px; left:100px;} 75%{top:150px;} 100%{top:200px; left:200px;}} 위의 코드에서 처럼 각각의 퍼센트마다 css를 통해 다양한 효과들을 만들어 낼 수 있습니다. 0%의 처음(top:0 , left:0) 위치에서 시작해 각각의 단계를 거쳐 100% 의 마지막 ..
transform transform은 엘리먼트의 위치, 크기, 회전, 기울기를 변경하는 속성입니다. 2D transform, 3D transform으로 나눠집니다. 2D transform 3D transform matrix matrix3D translate translate3D translateX translateZ translateY scale3D scale scaleZ scaleX rotate3D scaleY rotateX rotate rotateY skew rotateZ skewXperspective skewY transform 속성의 속성값은 transform : scale(2, 3) 과 같은 형태로 사용할 수 있습니다. transform : scale(2, 3) == transform : sca..
position 의 이해 및 활용 css 에서 position 속성은 엘리먼트들의 위치를 지정해주는 역활을 하는 중요한 속성입니다.position에는 static, relative, absolute, fixed 라는 값을 가집니다. static 먼저 static 은 position 속성의 기본값으로 offset (top, right, bottom, left) 값에 영향을 받지 않고정적으로 위치하게 되어 생성된 위치를 고수합니다. relative relative는 상대적인 위치를 나타내며 자신의 생성된 위치에서 offset 값을 통해 이동이 가능합니다. 부모에 위치값에 영향을 받지 않고 offset 값만을 따릅니다. absolute absolute는 relative와 마찬가지로 offset 값을 통해 이동..
가상 선택자에는 크게 가상 클래스 선택자 와 가상 요소 선택자로 나눌 수 있습니다. HTML에 이미 존재하는 요소를 선택하면 "가상 클래스" 선택자. HTML에 존재하지 않지만 가상의 요소를 생성하여 선택하는 것은 "가상 요소" 선택자. 참고: 가상 클래스는 가상 요소보다 구체성이 높습니다. 가상 클래스 선택자 에는 : active 사용자에 의해 활성화되어있는 요소를 나타냅니다. 마우스를 사용하는 경우에는 일반적으로 마우스 버튼을 누르는 순간부터 떼는 시점까지를 의미합니다. 일반적으로 와 에 사용되지만, 다른 요소에도 사용될 수 있습니다.:active 가상 클래스로 정의된 스타일은 적어도 하나의 동등한 특수성을 갖는 일련의 후속 링크 가상 클래스( :link, :hover, :visited)에 의해 재..
TAG Description header 헤더를 의미합니다. nav 내비게이션을 의미합니다. aside 사이드에 위치하는 공간을 의미합니다. section 본문의 여러 내용을 포함하는 공간을 의미합니다. article 본문의 주내용이 들어가는 공간을 의미합니다. footer 푸터를 의미합니다.
# 시맨틱 웹(Semantic Web) 전세계적으로 수십억명의 인터넷 사용자가 존재하고 수십억개의 사이트가 존재합니다. 대부분의 인터넷 사용자는 원하는 정보들을 얻기위해 Google이나 Naver와 같은 검색사이트를 이용합니다. 웹사이트는 검색엔진 노출이 매우 중요 합니다. 검색엔진에 노출되지 않는 웹사이트는 접속하는 이도 없기 때문입니다. 검색엔진은 이 시대의 가장 강력한 권력 중의 하나라고 말할 수도 있을 정도입니다. SEO(검색엔진 최적화: Search Engine Optimization)같은 마케팅 도구를 사용하여 검색엔진이 본인의 웹사이트를 검색하기 알맞은 구조로 웹사이트를 조정하기도 하는데, 이것은 기본적으로 검색엔진이 웹사이트 정보를 어떻게 수집하는지 아는 것으로 부터 시작 됩니다. 검색엔진..
HTML5는 2014년 10월 28일 확정된 차세대 웹 표준으로 새로운 기능들이 추가 되었습니다. 1. 멀티미디어(Multimedia) 플래시와 같은 플러그인의 도움없이 비디오 및 오디오 기능을 자체적으로 지원 합니다. 2. 그래픽(Graphics & Effects) SVG, Canvas를 사용한 2차원 그래픽과 CSS3, WebGL을 사용한 3차원 그래픽을 지원 합니다. 3. 통신(Connectivity)지금까지의 HTML은 단방향 통신만이 가능하였으나 HTML5는 서버와의 소켓 통신을 지원하므로 서버와의 양방향 통신이 가능합니다. 4. 디바이스 접근(Device acess)카메라, 동작센서 등의 하드웨어 기능을 직접적으로 제어할 수 있습니다. 5. 오프라인 및 저장소(Offline & Storage)..