모바일을 위한 DTD의 종류와 특징
모바일 기기는 다음과 같은 특성을 가집니다. 적은 메모리 용량, 적은 저장 공간, 작은 스크린 사이즈, 느린 CPU, 입력방법의 제한, 전원(밧데리)의 시간 제한 초기의 모바일 기기들은 웹을 사용하기에는 성능이나 메모리, 스크린사이즈가 매우 조악하였기 때문에 모바일 기기에 특화된 언어로 WML(wireless Markup Language)를…
카테고리 HTML & CSS
HTML과 CSS에 관련된 자료
IE6 의 CSS 다중선택자 버그에 대해
CSS에서 사용하는 다중 선택자(Multi Class)란 동일 엘리먼트에 여러개의 선택자(id, class)를 동시에 적용하기 위한 목적으로 여러개의 선택자를 사용하는 것을 말합니다. CSS1에서 선택자의 개념이 사용된 후, CSS2에서 다중 선택자가 추가되어 사용되고 있는데요, CSS를 사용해 웹사이트를 개발하다 보면 다중선택자는 매우 편리한 존재임을 알…
나를 미치게 하는 PNG
인터넷 브라우저에서 사용할 수 있는 이미지는 아시다시피 GIF, JPG, PNG 가 있습니다. 그중, 웹에서 사용할 수 있는 이미지로서의 PNG 는 GIF 나 JPG 에 비해 많은 장점을 가지고 있습니다. PNG 는 “Portable Network Graphics” 의 약자이며, 프리웨어이고, JPG 와는 달리…
웹브라우저를 위한 웹표준 테스트 Acid test
최근들어 MicroSoft 에서 개발중인 Internet Explorer 8 이 Acid2 test 를 통과했다던가, 새로운 웹표준 테스트로 발표된 Acid3 가 웹브라우저 시장에 좌절을 안겨주고 있다는 소식이 들려오고 있습니다. 특히 IE8 이 Acid2를 통과했다는 소식은 이제 IE도 악명높은 IE6 의 비정상적인 렌더링을 벗어나…
CSS의 display 속성
CSS의 display 속성은 해당 엘레멘트가 화면에 어떻게 보여지는지를 결정하는 역할을 합니다. display 속성의 값은 다 따지면 19가지나 되지만, 실제로 자주 쓰이는 것은 inline과 block, inline-block, none 값이며, 이외의 것은 브라우저에서 지원하지 않는 것도 많기 때문에 불안정해서 사용되지 않는다고 하네요. block…
CSS 박스 모델에 대해
CSS 에서 가장 중요한 개념 중 하나가 박스모델입니다. 박스모델의 개념을 이해함으로써 각각의 엘리먼트를 문서에 배치하는 원리를 알 수 있기 때문입니다. 그리고 이를 응용하여 전체 레이아웃을 정의할 수도 있고, 콘텐츠를 디자인할 수도 있기 때문에 CSS를 통한 디자인을 하려면 박스모델을 이해하는 것이…
CSS의 em 단위
CSS에서는 글자 폰트 크기나 width, height 등의 크기를 지정할 때 다양한 단위를 사용할 수 있습니다. (pt, px, em, ex, %) 대부분의 브라우저는 단위를 사용하지 않으면 자동으로 px단위(모니터의 픽셀)로 인식하여 렌더링을 하게 되지만, 현재 표준은 단위를 항상 명시해주는 것입니다. (0 제외)…
이젠 CSS도 프레임워크 등장? BluePrint 0.5
최근 웹 2.0 시대에 들어서 RIA가 대세가 됨에 따라… 마치 플래시와 같은 동적인 UI를 구현하기 위해서 자바스크립트 개발의 중요성이 많이 부각되었습니다. 이러한 개발을 도와주는 도구로 각종 컴포넌트와 편리한 명령어를 담은 자바스크립트 프레임워크가 많이 개발되어 있습니다. 잘 알려진 자바스크립트 프레임워크로는 Prototype.js,…
XHTML Cheat Sheet – ver1.03
XHTML을 통한 UI개발 시에 참고할 수 있는 Cheat Sheet 입니다. 사무실이나 집에서 책상 벽에 붙여놓고 필요할 때 참고하면서 사용하기에도 좋은 듯. (그리고 이런 것 붙여놓으면 폼나잖아요~? ㅋㅋ) XHTML 상에서 사용하는 태그와 태그별로 사용가능한 속성을 표 형태로 표기한 문서이구요, 2페이지입니다. 예를…
CSS 핵
브라우저마다 HTML렌더링하는 방식이 조금씩 차이가 나고, 때로는 버그가 존재하는 관계로(망할 IE) 모든 CSS 코드가 모든 웹브라우저에서 똑같이 보이지 않습니다. 따라서 이러한 특성을 이용하여 특정 브라우저를 제외하거나, 특정 브라우저에서만 CSS를 적용하는 기법을 CSS 핵(Hack) 이라고 부르죠… 그래서 문법적으로 맞지 않거나, 특정…