odada

전역 구조화 Element class Attribute 사용은 하지 않는다.XHTML dtd 사용시에는 다음과 같이 XML namespace 및 lang attribute를 선언해준다 meta, title, link, style, script 순으로 Element 를 선언한다 문서의 기본 인코딩 및 뷰포트 등을 선언한다. (뷰포트는 모바일 서비스의 경우에만 선언)현재 페이지의 제목을 선언한다.rel, type, href 순서로 attribute를 선언한다 하위에 선언이 되는 CSS는 Element보다 1depth 들여쓴다 body Element에는 다른 attribute를 사용하지 않는 것을 원칙으로 한다. 제목, 문단, 구분선 Element Heading 의미 : HTML 구조상 문서 내부의 컨텐츠 제..

일반 (X)HTML/CSS/SCRIPT 분리 문서의 내용과 디자인과 행동을 분리한다. 분리하는 목적은 CSS와 javascript 없이도 문서를 이용할 수 있게 하는데 있다. 정확한 문서 구조 준수 문서의 기본 구조는 다음과 같이 해당페이지의 기본정보를 포함하는 head와 본문을 포함하는 body를 갖는다. (해당 페이지 본문) HTML5 ... DTD 및 인코딩DTD란? 브라우저에게 웹페이지의 문서종류를 알려주는 선언문으로, 해당 문서의 최상단에 선언한다. DTD는 브라우저가 올바른 화면표시(Rendering)를 하기 위해 반드시 필요하다. DTD를 사용하면 브라우저들의 렌더링을 표준에 맞춰 렌더링을 하게끔 하기 때문에 다양한 환경에서 상호 운용성을 보장할 수 있다. DTD 기본 형식 블록요소, 인라인..

DOCTYPE 문서타입에 (X)HTML의 버전과 문서형을 지정하는데, 다양한 플랫폼 지원을 위해 XHTML 1.0 , 하위 브라우져 호환성을 위해 Transitional 모드를 권장하고 있다. (Transition 모드를 사용하더라도, 웹표준 준수율의 향상을 위해 가급적 Strict 모드의 문법을 사용하는 것을 권장함) 시스템 식별자를 명시하여 Standards 모드 방식으로 지원해야 하나 예외적으로 메일, 개별카페, 개별블로그 등의 UCC영역에 해당하는 서비스는 과거 비표준 태그 허용을 위해 Quirks 모드로 지원할 수 있다. HTML5 권장 XHTML HTML 일반 문서 제목 각 페이지마다 서로 다른 규칙으로 사용중인 문서 제목 ( 태그) 규칙을 일원화함으로써, 서비스 통일성을 높이고 사내 검색 엔..

Zeplin 제플린(Zeplin)은 디자이너 및 개발자를 위한 공동 작업 응용 프로그램입니다. 제플린은 스케치 또는 포토샵과 연동하여 자동으로 작업한 결과물을 이미지 파일 Asset과 디자인 가이드로 생성해 줍니다. https://zeplin.io/ Zeplin Connected space for product teams. Handoff designs and styleguides with accurate specs, assets, code snippets—automatically. zeplin.io 1. 다운 및 설치 아래 사이트에서 본인의 운영체계와 맞는 설치 프로그램을 다운 받아 설치하고 로그인 합니다. https://support.zeplin.io/en/articles/244698-downloadi..

DOCTYPE html> flex : css ul { background: lightpink; } li { display: block; width: 100px;height: 100px; margin: 10px; text-align: center; line-height: 100px; background: #fff; } flex .flex-1 { display: flex; } 1 2 3 .flex-2 { display: flex; flex-direction: column; } 1 2 3 1 2 3 1 2 3 1 2 3 1 2 3 1 2 3 1 2 3 1 2 3 1 2 3 1 2 3 1 2 3 1 2 3 1 2 3 1 2 3 1 2 3 1 2 3 1 2 3 1 2 3 1 2 3 1 2 3 1 2 3 1 2 3..

썸네일(Thumbnail)이란? 썸네일이란 엄지손가락 손톱만한 스케치를 말하며, 정식 작업 전 주로 아이디어 정리를 간단히 표현하기 위해 사용되던 일종의 스케치입니다. 즉 만들고자 하는 작품의 대강을 미리 그려 다른 사람으로 하여금 전체적인 감과 레이아웃 등을 알 수 있게 해주는 스케치를 말합니다.

GaugeMeter.js jQuery 플러그인 jQuery로 제작 된 그래픽 게이지 미터 github.com/Mictronics/GaugeMeter Mictronics/GaugeMeter An elegant and dynamic animated graphical gauge meter built with jQuery. GaugeMeter.js is highly customizable and includes full-radial, semi-radial & arch dials. - Mictronics/GaugeMeter github.com 사용방법 1. jQuery & JavaScript Code 추가 태그 내에 아래 코드 추가

html5up.net/ HTML5 UP Responsive HTML5 and CSS3 site templates designed by @ajlkn and released under the Creative Commons license. html5up.net kalanidhithemes.com/ Kalanidhi Themes kalanidhithemes.com 부트스트랩 템플릿 themehunt.com/ Free Bootstrap Templates & WordPress Themes A great collection of multipurpose free templates and WordPress Themes. Browse and download theme for your personal, business or..

m.blog.naver.com/PostView.nhn?blogId=designondo&logNo=220915027585&proxyReferer=https:%2F%2Fwww.google.com%2F CSS web font 웹폰트 ttf, eot, woff 만들고 설치 사용하기 시작하기 전 알아두기!CSS3의 @font-face는, CSS2에서 부터 존재해 온 규칙이 있다고 합니다. 우리가... blog.naver.com 시작하기 전 알아두기! CSS3의 @font-face는, CSS2에서 부터 존재해 온 규칙이 있다고 합니다. 우리가 흔히 웹폰트라 부르는 Embedded Open Type(.eot)포맷의 라이센스로 인해 해당 포맷을 지원하는 유일한 웹브라우저인 인터넷 익스플로러에서만 사용했습니다. 그러나,..

전공별 자격연계 검색하기 www.cb.or.kr/creditbank/eduIntro/nEduIntro2_4_3.do 1. 컴퓨터공학 자격연계 2. 시각디자인학 자격연계