제주에서 작은 IT 사업을 하고 있는 유지 아빠가 보고 듣고 느끼는 진솔한 이야기를 나누는 공간입니다.

CSS3 22

처음부터 다시 배우는 HTML5 & CSS3 전면개정판.

생애 처음으로 출간했던 "처음부터 다시 배우는 HTML5 & CSS3"는 나름 성과를 낸 책입니다.이번에 "처음부터 다시 배우는 HTML5 & CSS3" 전면 개정판은 1판의 내용을 전면적으로 개편한 내용으로 HTML5와 CSS3에 대한 전반적인 내용을 모두 담고 있습니다. 특히 1판에서 다루지 못했던 부분들이 많이 추가됨에 따라 책 페이지 수가 많이 증가하였습니다.또한 예제 사이트도 1판과는 달리 최신 트렌드에 맞춰 새롭게 제작되었습니다. 여러분의 많은 관심과 성원 부탁드립니다.

웹 & IT 2013.09.15

CSS3에 하나를 더해 CSS를 아주 강력하게 만들어 주는 HITCH

현재 웹의 대세는 HTML5와 CSS3입니다.하지만 아무리 대세이더라도 CSS3를 완벽하게 지원하는 브라우저는 없습니다.또한 CSS3 에서 추가된 많은 선택자를 사용하더라도, 개발자의 요구에 맞게 좀 더 정교한 선택자가 필요할 경우가 있습니다. Hitch는 이런 개발자를 위하여 자바스크립트를 이용하여 CSS의 기능을 엄청나게 향상 시켜줍니다. 아래의 그림을 누르시면 해당 사이트로 이동하는데, 사이트 첫 부분에 Hitch 에 대한 소개와 어떻게 사용하는지에 대한 내용이 나옵니다.또한 DEMO를 보시면 아~~~ 이런 기능이 있구나~ 라는 느낌이 오실 겁니다. hitch를 사용하기 위해서 hitch 자바스크립트가 반드시 웹 문서에 필요하며, CSS 내부에는 -hitch라는 prefix가 사용되어야 해당 기능이..

웹 & IT 2013.06.15

처음부터 다시 배우는 HTML5 & CSS3 강의자료 13일

12일차 강의 목록은 다음과 같습니다. 백그라운드 이미지 처음부터 다시 배우는 HTML5 & CSS3 강의자료 13일차 from Michael Yang 내용은 책 내용을 압축한 것입니다. 보다 자세한 학습을 위해서는 책을 구입하시는 것이 좋습니다. 본 내용의 저작권은 양용석(ugpapa@gmail.com)과 로드북에 있습니다. 자료를 공유를 할 수는 있습니다만, 반드시 저에게 먼저 허락을 득하시고 공유해 주시기 바랍니다

강의자료 2013.04.06

처음부터 다시 배우는 HTML5 & CSS3 강의자료 12일차

12일차 강의 목록은 다음과 같습니다. 1.border 이해하기 2.border의 속성 3.border-radius 이해하기(css3) 4.box-shadow를 이용한 박스에 그림자 효과 주기(css3) 처음부터 다시 배우는 HTML5 & CSS3 강의자료 12일차 from Michael Yang 내용은 책 내용을 압축한 것입니다. 보다 자세한 학습을 위해서는 책을 구입하시는 것이 좋습니다. 본 내용의 저작권은 양용석(ugpapa@gmail.com)과 로드북에 있습니다. 자료를 공유를 할 수는 있습니다만, 반드시 저에게 먼저 허락을 득하시고 공유해 주시기 바랍니다.

강의자료 2013.03.28

처음부터 다시 배우는 HTML5 & CSS3 강의자료 10일차

10일차 강의 목록은 다음과 같습니다. 1.그룹 선택자 2.전체선택자 3.자식 선택자 4.인접 선택자 5.CSS 주석 달기 6.수도 선택자 7.패밀리 트리로 이해하는 상속 8.CSS 선택자 결론 처음부터 다시 배우는 HTML5 & CSS3 강의자료 10일차 from Michael Yang 내용은 책 내용을 압축한 것입니다. 보다 자세한 학습을 위해서는 책을 구입하시는 것이 좋습니다. 책 구입은 화면 오른쪽에 있는 "처음부터 다시 배우는 HTML5&CSS3" 배너를 클릭하시면 yes24,.com으로 연결되며, 그곳에서 구입하시면 됩니다. 본 내용의 저작권은 양용석(ugpapa@gmail.com)과 로드북에 있습니다. 자료를 공유를 할 수는 있습니다만, 반드시 저에게 먼저 허락을 득하시고 공유해 주시기 바랍..

강의자료 2013.03.17

처음부터 다시 배우는 HTML5 & CSS3 강의자료 9일차

9일차 강의 목록은 다음과 같습니다. 1.선택자의 개념과 활용 2.태그 선택자 3.클래스 선택자 4.아이디 선택자 처음부터 다시 배우는 HTML5 & CSS3 강의자료 9일차 from Michael Yang 의 내용은 책 내용을 압축한 것입니다. 보다 자세한 학습을 위해서는 책을 구입하시는 것이 좋습니다. 책 구입은 화면 오른쪽에 있는 "처음부터 다시 배우는 HTML5&CSS3" 배너를 클릭하시면 yes24,.com으로 연결되며, 그곳에서 구입하시면 됩니다. 본 내용의 저작권은 양용석(ugpapa@gmail.com)과 로드북에 있습니다. 자료를 공유를 할 수는 있습니다만, 반드시 저에게 먼저 허락을 득하시고 공유해 주시기 바랍니다.

강의자료 2013.03.17

처음부터 다시 배우는 HTML5 & CSS3 강의자료 8일차

8일차 강의 목록은 다음과 같습니다. 1. CSS 기초 학습에 들어가기 앞서 2. CSS 기초 3. CSS를 적용하는 다양한 방법 4.인라인 방식으로 스타일 적용 5.임베디드(Embedded) 방식으로 CSS 적용 6.외부파일에 의한 CSS 적용 7.선택자 적용 정리 처음부터 다시 배우는 HTML5 & CSS3 강의자료 8일차 from Michael Yang 의 내용은 책 내용을 압축한 것입니다. 보다 자세한 학습을 위해서는 책을 구입하시는 것이 좋습니다. 책 구입은 화면 오른쪽에 있는 "처음부터 다시 배우는 HTML5&CSS3" 배너를 클릭하시면 yes24,.com으로 연결되며, 그곳에서 구입하시면 됩니다. 본 내용의 저작권은 양용석(ugpapa@gmail.com)과 로드북에 있습니다. 자료를 공유를 ..

강의자료 2013.03.08

IE10 간단 호환성 테스트

IE10 윈도우 7용이 정식 출시 됨에 따라 몇가지 테스트한 결과를 보여드리겠습니다. 현재 제가 사용하는 시스템은 윈도우 7 64비트 프로버전입니다. 1. HTML5 지원여부 테스트 500PX.COM 이라는 사진 공유 사이트는 사진 업로드를 HTML5의 Drag & Drop을 이용합니다. IE9까지는 Drag & Drop을 지원하지 않았지만, IE10에서는 Drag & Drop을 지원하는 것을 확인했습니다. 2. Active X 지원 여부 액티브 엑스를 정말 퇴출되어야할 기술이지만, 한국의 현 상황에서는 너무 많은 보안 모듈과 기타 여러 가지 기술을 액티브 엑스에 의존하다 보니, 엑티브 엑스가 없으면, 인터넷 뱅킹이나, 기타 인터넷 쇼핑등에서 많은 불편을 겪을 수 있습니다. IE10에서는 현재 제가 사용..

웹 & IT 2013.02.27

IE10 윈도우 7용 출시 되었습니다.

다운로드 URL은 http://windows.microsoft.com/en-us/internet-explorer/downloads/ie-10/worldwide-languages 입니다. 정식버전입니다. 일단 설치중이기때문에 설치 후 호환성 부분 그리고 HTML5 와 CSS3 지원여부와 성능등에서 평가해 보도록 하겠습니다. IE10은 HTML5의 모든 기능과 CSS3의 모든 기능이 지원된다고 했으니, 정밀한 테스트 후 다시 게제 하겠습니다. 설치는 32비트와 64비트 버전이 따로 있기 때문에 현재 사용하시는 시스템 정보를 확인하시고 설치하시면 됩니다.

웹 & IT 2013.02.27

처음부터 다시 배우는 HTML5 & CSS3 강의자료 7일차

제가 쓴 "처음부터 다시 배우는 HTML5&CSS3"  강의 7일차 연재합니다.7일차 강의 목록은 다음과 같습니다.1. audio태그 활용하기2. embed태그 활용하기3. canvas태그 맛보기4. HTML5멀티미디어 요소 결론 처음부터 다시 배우는 HTML5 & CSS3 강의자료 7일차 from Michael Yang 강의 내용은 책 내용을 압축한 것입니다. 보다 자세한 학습을 위해서는 책을 구입하시는 것이 좋습니다.책 구입은 화면 오른쪽에 있는 "처음부터 다시 배우는 HTML5&CSS3" 배너를 클릭하시면 yes24,.com으로 연결되며, 그곳에서 구입하시면 됩니다. 본 내용의 저작권은 양용석(ugpapa@gmail.com)과 로드북에 있습니다. 자료를 공유를 할 수는..

강의자료 2013.02.26

처음부터 다시 배우는 HTML5 & CSS3 강의자료 6일차

제가 쓴 "처음부터 다시 배우는 HTML5&CSS3"  강의 6일차 연재합니다.5일차 강의 목록은 다음과 같습니다.1.비디오 태그 탄생 배경2.비디오코덱3.동영상변환4.비디오태그 사용5.하위버전 브라우저에서 동영상 재생하기 처음부터 다시 배우는 HTML5 & CSS3 강의자료 6일차 from Michael Yang 강의 내용은 책 내용을 압축한 것입니다. 보다 자세한 학습을 위해서는 책을 구입하시는 것이 좋습니다.책 구입은 화면 오른쪽에 있는 "처음부터 다시 배우는 HTML5&CSS3" 배너를 클릭하시면 yes24,.com으로 연결되며, 그곳에서 구입하시면 됩니다. 본 내용의 저작권은 양용석(ugpapa@gmail.com)과 로드북에 있습니다. 자료를 공유를 할 수는 있습..

강의자료 2013.02.25

처음부터 다시 배우는 HTML5 & CSS3 강의자료 5일차

제가 쓴 "처음부터 다시 배우는 HTML5&CSS3"  강의 5일차 연재합니다.5일차 강의 목록은 다음과 같습니다.케스케이딩 스타일 시트(CSS) 이해하기CSS의 진화 과정CSS와 HTML의 상호작용 원리 CSS 일반 규칙과 CSS3에서 추가된 속성클래스 선택자와 아이디 선택자의 차이점   처음부터 다시 배우는 HTML5 & CSS3 강의자료 5일차 from Michael Yang 강의 내용은 책 내용을 압축한 것입니다. 보다 자세한 학습을 위해서는 책을 구입하시는 것이 좋습니다.책 구입은 화면 오른쪽에 있는 "처음부터 다시 배우는 HTML5&CSS3" 배너를 클릭하시면 yes24,.com으로 연결되며, 그곳에서 구입하시면 됩니다. 본 내용의 저작권은 양용석(ugpapa@gmail.com)과 로..

강의자료 2013.02.18

처음부터 다시 배우는 HTML5 & CSS3 강의 - 4일

제가 쓴 "처음부터 다시 배우는 HTML5&CSS3"  강의 4일차 연재합니다.4일차 강의 목록은 다음과 같습니다.1.HTML 문서의구조 설계 2.HTML5 을이용한 HTML 문서 구조 잡기  처음부터 다시 배우는 HTML5 & CSS3 강의자료 4일차 from Michael Yang 강의 내용은 책 내용을 압축한 것입니다. 보다 자세한 학습을 위해서는 책을 구입하시는 것이 좋습니다.책 구입은 화면 오른쪽에 있는 "처음부터 다시 배우는 HTML5&CSS3" 배너를 클릭하시면 yes24,.com으로 연결되며, 그곳에서 구입하시면 됩니다. 본 내용의 저작권은 양용석(ugpapa@gmail.com)과 로드북에 있습니다. 자료를 공유를 할 수는 있습니다만, 반드시 저에게 먼저 허락을 득하시고..

강의자료 2013.02.17

처음부터 다시 배우는 HTML5 & CSS3 강의 - 3일

제가 쓴 "처음부터 다시 배우는 HTML5&CSS3"  강의 3일차 연재합니다.3일차 강의 목록은 다음과 같습니다.1.HTML5와XHTML1.0의 차이점 2.HTML5에서추가된 태그3.HTML5에서사라진 태그 처음부터 다시 배우는 HTML5 & CSS3 강의자료3일차 from Michael Yang 강의 내용은 책 내용을 압축한 것입니다. 보다 자세한 학습을 위해서는 책을 구입하시는 것이 좋습니다.책 구입은 화면 오른쪽에 있는 "처음부터 다시 배우는 HTML5&CSS3" 배너를 클릭하시면 yes24,.com으로 연결되며, 그곳에서 구입하시면 됩니다. 본 내용의 저작권은 양용석(ugpapa@gmail.com)과 로드북에 있습니다. 자료를 공유를 할 수는 있습니다만, 반드시 저에게 먼..

강의자료 2013.02.16

처음부터 다시 배우는 HTML5 & CSS3 강의 - 2일

제가 쓴 "처음부터 다시 배우는 HTML5&CSS3"  강의 2일차 연재합니다.2일차 강의 목록은 다음과 같습니다.1.DOCTYPE1.1 HTML 4.01DOCTYPE1.2XHTML 1.0 DOCTYPE1.3 Strict와 Transitional(loosed)의 차이점1.4 XHTML1.1DOCTYPE1.5 HTML 5 DOCTYPE2.용어살펴보기 3.HTML 문서의기본 구조  처음부터 다시 배우는 HTML5 & CSS3 강의자료 2일차 from Michael Yang 강의 내용은 책 내용을 압축한 것입니다. 보다 자세한 학습을 위해서는 책을 구입하시는 것이 좋습니다.책 구입은 화면 오른쪽에 있는 "처음부터 다시 배우는 HTML5&CSS3" 배너를 클릭하시면 yes2..

강의자료 2013.02.14

처음부터 다시 배우는 HTML5&CSS3 강의 - 1일차

제가 쓴 "처음부터 다시 배우는 HTML5&CSS3" 강의 연재하겠습니다. 1일차 강의 목차는 다음과 같습니다. 1.웹 표준 등장 배경 2.웹 표준이란 3.기본적인 웹 표준 문서의 상호 관계 4.웹 접근성을 높여 주는 웹 표준 5.환경을 보호하는 웹 표준 6.브라우저에서 캐시란? 7.사이트 개발 기간의 단축과 유지 보수의 용이성 8.정밀하게 제어할 수 있는 사이트 디자인 처음부터 다시 배우는 HTML5 & CSS3 1일차 from Michael Yang 강의 내용은 책 내용을 압축한 것입니다. 보다 자세한 학습을 위해서는 책을 구입하시는 것이 좋습니다. 책 구입은 화면 오른쪽에 있는 "처음부터 다시 배우는 HTML5&CSS3" 배너를 클릭하시면 yes24,.com으로 연결되며, 그곳에서 구입하시면 됩니다..

강의자료 2013.02.13

CSS3의 애니메이션 속성을 이용한 Simple Multi-Item Slider

CSS3의 속성 중 가장 인상적인 것이 animation 속성과 transition 속성입니다. 이 속성을 이용하면 자바스크립트를 사용하지 않더라도, 아주 멋있는 애니메이션을 만들 수 있습니다. 지금 여기 소개하는 웹 페이지도 CSS3 의 animation 속성과 transition 속성을 이용해서 만든 결과 물인데, 상당히 인상적인 효과를 줄 수 있습니다. 자바스트립트를 사용하지 않기 때문에 브라우저에 무리가 없으며, 브라우저에서 자바스크립트를 비활성화 하더라도 작동하기 때문입니다. 다만 해당 속성이 제대로 작동하기 위해선 CSS3를 완벽하게 지원하는 브라우저가 필요합니다. IE 계열은 IE10이 유일하게 CSS3 속성을 전부 지원합니다. 하지만 파이어폭스 및 크롬 및 사파리인 경우 최신 버전만 설치하..

웹 & IT 2013.01.10

47개의 놀라운 CSS3 애니메이션

web designer wall에 있는 article을 기반으로 작성하였습니다. 따라서 이 article에 소개된 예제의 저작권은 web designer wall 에 있습니다. CSS3 기능 중에서 가장 놀라운 기능 중 하나가 CSS3 애니메이션 속성입니다. 하지만 CSS3 애니메이션은 최신 버전의 IE9에서도 지원하지 않습니다. 이 페이지에 있는 예제들은 사파리 또는 구글 크롬과 같은 webkit 계열 브라우저에서 완벽하게 지원합니다.

처음부터 다시 배우는 HTML5&CSS3: 실전 웹 표준 사이트 구축까지를 소개 합니다.

아래의 내용은 로드북 출판사 블로그에서 발췌한 내용입니다. l저자: 양용석 l 페이지: 448 l 판형: 4x6배변형(190x244) l 도수: 2도 l 정가: 25,000원 l 발행일: 2011년 10월 4일 l ISBN: 978-89-966598-3-9 구매하기 ☞ [강컴] [교보] [리브로] [11번가] [알라딘] [예스24] [인터파크] _도서 내용 이 책은 HTML5와 CSS3의 새로운 점에 포커스를 맞추고 있지는 않습니다. 웹 표준의 핵심 철학인 "구조와 디자인의 분리"라는 관점에 맞게 달라진 웹 개발 방식을 제대로 배울 수 있도록 하는 것이 이 책의 주목적입니다. 이 책으로 학습하는 독자가 HTML5로 구조를 제대로 설계할 수 있고 CSS3로 정밀하고 자유자재로 디자인을 컨트롤할 수 있는 정..