css 썸네일형 리스트형 CSS와 jQuery의 Selector 같은 코딩 페턴으로 Html, CSS을 렌더링 해 주는 Zen Coding을 알고 계십니까? 얼마전 Editplus 버전을 업데이트 했습니다. 잠깐 테스트 용으로요.. 그런데 왠 못 보던 메뉴가 생겼습니다. ZC라는 Zen Coding입니다. CSS나 혹은 jQuery를 많이 다뤄보신 분이라면.. 굉장히 편하게 Html을 작성 할 수 있는 코딩 도우미 입니다. 거의 모든 Editor에서 사용이 가능한 것 같습니다. vs 2010, 2012, editplus, eclips 등등등 코딩 형태는 아래와 같습니다. div#id.className>div.test 그리고 지정해 놓은 ZC 단축키를 누르게 되면 아래와 같이 확장 됩니다. div#id.className>div.test CSS나 jQuery를 많이 다뤄보신 분이라면.. 바로 알아 차릴 수 있는 직관적인 코딩 도우미라고 할 수 있겠네요!! 저 같.. 더보기 개발자를 위한 웹 표준 CSS의 이해 2(작성 방법, 우선순위, Selector) 2011/02/17 - [Developer/웹개발 기초] - 개발자를 위한 웹 표준 CSS의 이해 1(CSS BoxModel, Position, float, clear, z-index) CSS 작성 방법, 우선 순위, Selector 이번 시간에는 CSS의 작성 방법과 우선순위, 그리고 Element를 Select하는 방법에 대해서 알아보도록 하겠습니다. 1. 작성 방법 작성 방법의 종류는 아래와 같습니다. Inline Element에 직접 작성 Style Tag Style Tag에 직접 작성 Link Tag 외부 CSS를 Link Tag를 이용하여 연결 다음은 작성 Sample 입니다. 1. Inline Inline Style 2. Style Tag Style Tag 3. Link Tag stylesh.. 더보기 CSS Cross Browser Zoom In/Out(웹 브라우저 줌인/줌아웃) Zoom 이라는 속성이 있습니다. 값은 normal, number(scale), percentage를 받으며 적용은 아래와 같습니다. body { /* default : normal, 1.0, 100% */ zoom:1.25;/* number(scale) */ /*zoom:125%;percentage */ } script의 경우는 아래와 같습니다. $(document).ready(function() { //document.body.style.zoom = 1.00; //document.body.style.zoom = "100%"; document.body.style.zoom = "normal"; }); 적용은 간단합니다.. 이것은 IE 전용입니다. (하지만 Chrome, Safari4+ 에서도 됩니다.) .. 더보기 개발자를 위한 웹 표준 CSS의 이해 1(CSS BoxModel, Position, float, clear, z-index) CSS에서 boxmodel, position, float 대하여 알아보도록 하겠습니다. IE 8을 사용하면서 가장 저의 마음에 들었던 부분이 있습니다. 바로 개발자 도구입니다. 이전에는 IE 6, 7 사용 시 IEDeveloperToolbar라는 툴을 설치하여 사용하였는데. 그때도 “이거 괜찮다” 라는 생각을 많이 했었습니다. IE 8의 개발자 도구는 그야 말로 획기적인 툴이라고 말씀 드리고 싶습니다. *_* 갑자기 이야기가 삼천포에 갔네요.. *_*;; 본론으로 들어가서. 1. Box Model CSS 중 가장 많이 사용하는 Attibute가 바로 border, padding, margin이 아닐까 합니다. Layout 이나 Box Model 작성 시 필수로 사용하게 되는 속성들입니다. http://t.. 더보기 IE 전용 이미지 계단 현상 없애기.. 사이즈가 맞지 않았거나 이미지를 인위적으로 줄여 놓을 경우... 이미지가 계단 형태로 깨져 보이는 경우가 생깁니다.. 그런 경우... 스타일 적용으로 아주~ 간단하게 해결 하는 방법이 있습니다.. IE에서만 작동 되며,~ FF에서는 안되는 것 같고요~ IE 8에서는 사용해 보적이 없습니다~ 결론적으로 아래와 같이 스타일에 추가하시면 됩니다~ img {-ms-interpolation-mode:bicubic;} 감사합니다~ ㅎㅎㅎ 더보기 이전 1 다음
