코드랩 레퍼런스
closed는 브라우저 창이 닫혀 있는지 여부를 불린값으로 반환합니다. Definition closed는 브라우저 창이 닫혀 있는지 여부를 불린값으로 반환합니다. Syntax window.closed Compatibility 6 7 8 9 10 11 closed
onLine는 브라우저 온라인 상태여부를 결정합니다. Definition onLine는 브라우저 온라인 상태여부를 결정합니다. Syntax navigator.onLine Compatibility 6 7 8 9 10 11 onLine
geolocation는 브라우저 사용자의 위치를 반환합니다. Definition geolocation는 사용자의 위치를 반환합니다. Syntax navigator.geolocation Compatibility 6 7 8 9 10 11 geolocation
cookieEnabled는 브라우저에서 쿠키를 사용할 지 여부를 결정합니다. Definition cookieEnabled는 브라우저에서 쿠키를 사용할 지 여부를 결정합니다. Syntax navigator.cookieEnabled Compatibility 6 7 8 9 10 11 cookieEnabled
language는 브라우저의 운영체제 정보를 반환합니다. Definition language는 브라우저의 운영체제 정보를 반환합니다. Syntax navigator.userAgent Compatibility 6 7 8 9 10 11 userAgent Sample1 ...
product는 브라우저에서 사용되는 엔진 이름을 반환합니다. Definition product는 브라우저에서 사용되는 엔진 이름을 반환합니다. Syntax navigator.product Compatibility 6 7 8 9 10 11 product Sample1 ...
platform는 브라우저에서 사용되는 플랫폼 정보를 반환합니다. Definition platform는 브라우저에서 사용되는 플랫폼 정보를 반환합니다. Syntax navigator.platform Compatibility 6 7 8 9 10 11 platform Sample1 ...
language는 브라우저에서 사용되는 언어를 반환합니다. Definition language는 브라우저에서 사용되는 언어를 반환합니다. Syntax navigator.language Compatibility 6 7 8 9 10 11 language Sample ...
appVersion는 브라우저의 버전을 반환합니다. Definition appVersion는 브라우저의 버전을 반환합니다. appVersion는 읽기만 가능합니다. Syntax navigator.appVersion Compatibility 6 7 8 9 10 11 appVersion Sample ...
appName는 브라우저의 이름을 반환합니다. Definition appName는 브라우저의 이름을 반환합니다. IE11, Firefox, Chrome, Safari는 "Netscape"를 반환합니다. IE10 이전 버전은 "Microsoft Internet Explorer"를 반환합니다. 오페라는 "Opera"를 반환합니다. Syntax navigator.appName Compatibility 6 7 8 9 10 11 appName Sample1 ...
Window Object Properties 속성 설명 closed window.closed는 브라우저 창이 닫혀 있는지 여부를 불린값으로 반환합니다. defaultStatus window.defaultStatus는 브라우저 창 상태 표시 줄의 기본 텍스트를 설정하거나 반환합니다. document document는 document 객체를 정의합니다. frameElement window.frameElement는 현재 브라우저 대신에 iframe 요소를 반환합니다. frames window.frames는 브라우저 사용된 프레임을 배열 형태로 설정합니다. history history는 history 객체를 정의합니다. innerWidth window.innerWidth는 브라우저 컨텐츠 영역의 가로 값을 반환..
appCodeName는 브라우저의 코드명을 반환합니다. Definition appCodeName는 브라우저의 코드명을 반환합니다. 최신 브라우저는 대부분은 호환성을 이유로 "Mozilla"라고 반환합니다. appCodeName는 읽기만 가능합니다. Syntax navigator.appCodeName Compatibility 6 7 8 9 10 11 appCodeName Sample1 ...
HTML Question 글씨를 클릭하면 링크를 걸고 싶을 때 쓰는 태그는? 사이트의 기본 URL을 설정하고 싶을 때 쓰는 태그는? 짧은 글을 인용하고 싶을 때 쓰는 태그는? 긴 글을 인용하고 싶을 때 쓰는 태그는? 음성이나 분위기를 나타낼 때 쓰는 태그는? 기술적인 구문, 외국어, 사상, 생각, 선박이름 등을 나타낼 때 쓰는 태그는? 전문적인 용어나 학문적인 용어를 쓸 때 필요한 태그는? 작품의 제목을 정의할 때 쓰는 태그는? 생략된 글자가 있거나 약어가 필요할 때 쓰는 태그는? 저작권 또는 법적인 텍스트를 사용할 때 쓰는 태그는? 다른 사이트의 소스를 가져올 때 쓰는 태그는? 글씨를 굵게 표현하고 싶을 때 쓰는 태그는? 글씨를 강조하고 싶을 때 쓰는 태그는? 글씨의 중요성을 강조하고 싶을 때 쓰는 태..
CSS CSS(Cascading Style Sheets)은 HTML을 꾸며주는 스타일 시트입니다. 즉 웹 페이지를 꾸미고, 디자인 작업을 도와주는 언어입니다. CSS Syntax div { color : red; } CSS는 크게 선택자(seletor), 속성(property), 값(value)으로 구성되어 있습니다. 선택자(seletor) : 어떤 요소를 선택하기 위한 방법입니다. 속성(property) : 선택한 요소한테 속성을 줄 수 있습니다. 값(value) : 속성에 대한 값을 설정합니다. 기타 분류 HTML Description : HTML을 알파벳 순으로 정리 설명 HTML Element : HTML을 기능별로 정리 설명 CSS Description : CSS을 알파벳 순으로 정리 설명 CS..
HTML HTML(HyperText Markup Language)은 웹 페이지를 만들기 위한 언어입니다. HT - Hyper Text : 문서와 문서를 연결 M - Markup : 마크업, 태그 L - Language : 언어 즉 HTML이란? 문서와 문서로 연결된 태그 언어를 말합니다. 태그(Tag) 태그란 정보를 정의하는 방식을 정의합니다. 태그는 열린 태그()가 있습니다. 닫는 태그에는 "/" 있어야 합니다. 닫는 태그가 필요없는 태그도 있습니다. HTML5에서는 "/"가 생략이 가능합니다. 블록 요소/인라인 요소(Block/Inline) 블록요소는 박스, 인라인 요소는 텍스트를 의미합니다. 블록 엘리먼트(Block Element) 독립된 박스 영역으로, 한 줄에 하나에 블록 요소만 표현 할 수 있..
태그는 벡터 방식의 그림을 정의합니다. 특징 설명 콘텐츠 카테고리 - 콘텐츠 속성 - 콘텐츠 요소 - 닫는 태그 사용 버전 HTML4 시각적 표현 - Definition 태그는 벡터 방식의 그림을 정의합니다. Compatibility 6 7 8 9 10 11 svg
태그는 DOM 요소에 가상 요소를 삽입합니다. 특징 설명 콘텐츠 카테고리 Flow content, phrasing content, metadata content. 콘텐츠 속성 global attributes. 콘텐츠 요소(Contents Element) - 닫는 태그 - 시각적 표현 - 버전 HTML4 Definition 태그는 DOM 요소에 가상 요소를 삽입합니다.
태그는 사용자가 호출 할 수 있는 명렁어를 설정합니다. 특징 설명 콘텐츠 카테고리 Flow content, phrasing content, metadata content. 콘텐츠 속성 global attributes. 콘텐츠 요소(Contents Element) - 닫는 태그 - 시각적 표현 - 버전 HTML4 Definition 태그는 사용자가 호출할 수 있는 명렁어를 설정합니다.
태그는 텍스트를 깜박이게 합니다. 특징 설명 콘텐츠 카테고리 - 콘텐츠 속성 - 콘텐츠 요소(Contents Element) - 닫는 태그 - 시각적 표현 깜박임 버전 HTML4 Definition 태그는 텍스트를 깜박이게 합니다.
태그는 주어진 내용을 기계가 읽을 수 있도록 설정합니다. 특징 설명 콘텐츠 카테고리 Flow Content, Palpable Content 콘텐츠 속성 Global Attributes, Event Attributes 콘텐츠 요소 Inline Element 닫는 태그 사용 버전 HTML4 시각적 표현 - Definition 태그는 주어진 내용을 기계가 읽을 수 있도록 설정합니다. Compatibility 6 7 8 9 10 11 datalist
~ 태그는 제목 영역을 설정합니다. 특징 설명 콘텐츠 카테고리 Flow content, Heading content, Palpable content. 콘텐츠 속성 Global Attributes, Event Attributes 콘텐츠 요소(Contents Element) block Element 닫는 태그 Closing ( ~ ) 시각적 표현 볼드체 및 글씨 크기 변경 버전 HTML4 Property 속성 값(예) 설명 버전 align right left center justify 테이블의 행을 오른쪽으로 정렬합니다. 테이블의 행을 왼쪽으로 정렬합니다. 테이블의 행을 가운데로 정렬합니다. 테이블의 행을 양쪽으로 정렬합니다. Compatibility 6 7 8 9 10 11 Sample h1 태그는 섹션의..
HTML 요소를 기능별로 정리하면 Main Root, Metadata, Content Sectioning, Text Content, Inline Text Semantics, Image and Multimedia, Embedded Content, Scripting, Demarcating Edits, Table Content, Forms, Interactive Elements, Obsolete and Deprecated Elements 같이 분류 할 수 있습니다. Main Root 요소 설명 버전 태그는 HTML 문서의 최상위 루트를 나타나태는 요소입니다. - Metadata 요소 설명 버전 태그는 문서의 모든 URL의 기본이 되는 기본 URL을 설정합니다. - 태그는 사이트의 헤더 요소들의 일반적인 정보를..
기본적인 HTML와 CSS를 이용한 기본적인 사이트 제작입니다. 반응형 사이트, 패럴러즈 사이트가 아닌 가장 기본적인 구조의 사이트 제작입니다. HTML과 CSS를 활용한 사이트 제작입니다. 최대한 웹 표준을 준수하면서 제작할 것이며, W3C의 마크업과 CSS 검사를 통과할 것이며, 크로스브라우징도 준수할 것입니다. 브라우저는 익스플로러는 7, 8, 9, 10, 11버전, 사파리, 오페라, 크롬, 제이쿼리, 파이어폭스에서 동일한 화면이 나올 수 있도록 제작할 것이며, 플러그인을 이용한 갤러리 슬라이드와 간단한 자바스크립트를 사용할 것입니다. Site Reference W3C 마크업 검사 http://validator.kldp.org W3C CSS 검사 http://jigsaw.w3.org/css-vali..
HTML 요소를 속성별로 정리한 태그입니다. Font 속성 설명 font font 속성은 폰트 스타일, 폰트 변형, 폰트 두께, 폰트 사이즈, 폰트 간격, 폰트 종류를 설정합니다. font-family font-family 속성은 폰트 종류를 설정합니다. font-size font-size 속성은 폰트 사이즈 속성을 설정합니다. font-size-adjust font-size-adjust 속성은 소문자를 기준으로 폰트 크기를 설정합니다. font-stretch font-stretch 속성은 텍스트의 크기를 정의합니다. font-style font-style 속성은 폰트의 스타일을 정의합니다. font-variant font-variant 속성은 글꼴을 변형을 정의합니다. font-weight font-w..
CSS는 선택자를 통해 요소를 선택할 수 있습니다. CSS Selector 태그 유형 설명 버전 . .class {color:#fff;} 클래스 선택자 CSS1 # .id {color:#fff;} 아이디 선택자 CSS1 * * {color:#fff;} 전체 선택자 CSS2 element p {color:#fff;} 요소 선택자 CSS1 element, element p, div {color:#fff;} 그룹 선택자 CSS1 element element div p {color:#fff;} 후손 선택자 CSS1 element > element div > p {color:#fff;} 이웃 선택자 CSS2 element + element div > p {color:#fff;} 자식 선택자 CSS2 element..
CSS는 길이를 표현하기 위한 다양한 단위들이 있습니다. Definition 상대단위 (px, em, ex, %, rem, vw, vh, vmin, vmax) : 어떤 기준을 통해 상대적으로 변할 수 있는 단위이며, 다양한 매체에 쓰기 적절합니다. 절대단위 (in, cm, mm, pt, pc) : 정확한 기준에 의해 고정된 단위이며, 출력 매체에 쓰기 적절합니다. CSS Units 단위 설명 px 모니터의 1dot이 1pixel을 의미하며, pixel은 해상도에 따라서 상대적인 크기를 갖습니다. em 부모 요소의 대문자 너비를 기준으로 상대적인 값을 갖습니다. ex 부모 요소의 소문자 너비를 기준으로 상대적인 값을 갖습니다. % 부모 요소의 길이를 기준으로 상대적인 값(%)을 갖습니다. rem 루트(ro..
Content Element는 HTML을 Meta, Self-closing, Block, Inline으로 분류한 요소입니다. Meta는 정보를 표현하는 메타데이터를 의미하고, Self-closing는 닫는 태그가 없는 태그를 말하며, Block은 박스 구조의 HTML 요소를 말하며, inline은 텍스트 성질의 HTML을 말합니다. HTML 마크업에 있어 Block과 Inline만 구별해도 코딩이 훨씬 더 수월해집니다. 속성 설명 Meta Closing Inline Block 태그는 하이퍼 링크를 정의합니다. meta closing inline block 태그는 생략된 글자나 머리글자를 표시하는데 사용합니다. meta closing inline block 태그는 생략된 글자나 약어를 표시하는데 사용합니다..
Event 속성은 자바스크립의 이벤트 기능과 같은 기능으로 HTML에도 이벤트 기능이 추가되었습니다. Window Event Attributes 속성 값(예) 설명 버전 onafterprint onafterprint="function()" 문서가 인쇄된 후 스크립 이벤트를 설정합니다. onbeforeprint onbeforeprint="function()" 문서가 인쇄되기 전에 스크립 이벤트를 설정합니다. onbeforeunload onbeforeunload="function()" 사용자가 현재 페이지에서 떠나기 전에 이벤트를 설정합니다. onerror onerror="function()" 페이지가 오류 났을 때 이벤트를 설정합니다. onhashchange onhashchange="function()" ..
Global 속성은 모든 태그에 적용이 가능한 속성입니다. Property 속성 값(예) 설명 버전 accesskey accesskey="h" 요소를 활성화하거나 포커스 할 경우 단축키를 설정합니다. - class class="name" 요소의 클래스 이름을 설정합니다. - contenteditable contenteditable="true" 요소 컨텐츠의 편집 여부를 설정합니다. contextmenu contextmenu="menu_id" 요소 컨텐츠의 메뉴를 설정합니다. 마우스 오른쪽 클릭하면 나타납니다. data-* data-global="text" 요소의 개인적인 속성을 설정합니다. dir dir="rtl" 요소 컨텐츠의 방향을 설정합니다. - draggable draggable="true" 요소..
HTML 태그는 컨텐츠의 종류에 따라 정의 할 수 있습니다. 이러한 요소는 콘텐츠 모델로 정의 할 수 있습니다. 컨텐츠 요소는 Metadata Content, Flow Content, Section Conetnt, Heading Content, Phrasing Content, Embedded Content, Interactive Content, Palpable Content 등으로 분류됩니다. 메타데이터 콘텐츠 (Metadata Content) 웹 문서와 관련된 정보를 표현하는 콘텐츠와 다른 문서와의 관계를 유지하는 콘텐츠입니다. 요소 설명 태그는 문서의 모든 URL의 기본이 되는 기본 URL을 설정합니다. 태그는 사용자가 호출 할 수 있는 명렁어를 설정합니다. 태그는 문서와 외부 파일 연결 할 때 설정..