브라우저 썸네일형 리스트형 [자바스크립트] 브라우저별 포지션 정보 정리 (Browser Position Information) 브라우저별 포지션 정보 정리 (Browser Position Information) W : window,DE : document.documentElement,DB : document.body (1800px*1800px) Property IE9 Chrome ( 15.0.874.121 m ) Firefox ( 8.0.1 ) W.innerWidth/Height 1280 / 714 1280 / 713 1280 / 705 W.outerWidth/Height 1296 / 816 1280 / 800 1296 / 816 W.screenLeft/Top 0 / 85 0 / 0 undefined / undefined W.screenX/screenY -8 / -8 0 / 0 -8 / -8 W.pageXOffset/pageXO.. 브라우저모드? 문서모드? 다행히 IE11은 통합 된듯~! 익스11로 업그레이드 ㄱㄱ~! 익스플로러 브라우즈는 항상 골칫덩이... Html 코딩을 할 때마다 골칫덩이인 크로스브라우징... 진절머리가 난다...ㅡㅡ^ 여하튼, 크로스브라우징을 할때 익스를 버전별로 화면을 확인할 수 있는 IE Tester 를 사용하다가 언제부터인가 그냥 익스 개발자 도구를 더 많이 사용하게 되었다. IE Tester는 프로그램이 오류도 많이 나고, 무겁게 느껴져서...점점 사용횟수가 자연스레 잦아들었다. 그런데, 개발자 도구를 사용할때 마다 대충은 알고 있지만, 너무나 헷갈려 다시한번 정리해보기 위해 포스팅해본다. 도대체 브라우저모드, 문서모드 저 둘의 차이점은 무엇일까? 브라우저 모드 : 현재 브라우저의 기본 셋팅을 정의 하는 것 문서 모드 : 페이지를 해석하는 방식을 정의하는 것 이라고 정리 할 수 있다. 예.. 웹킷(Webkit)이란 무엇인가? 웹킷(Webkit)이란 무엇인가? 정의분석 웹킷(WebKit)이란 무엇인가? "정의(Justice)란 무엇인가"에서 "정의"가 철학적 관점따라 다르게 해석되고, 시대에 따라 달리 이해되는 것처럼, 웹킷도 기술적 관점에 따라, 웹의 발전이 급속히 진행됨에 따라 다양한 의미와 용도를 함의하고 있다고 볼 수 있다. 어떤 이는 웹킷을 하나의 웹브라우저로 바라보고, 다른 이는 웹킷을 즉시 상용화가 가능한 소프트웨어 솔루션으로 보고 있다. 그러나 웹킷의 정의는 상당히 명료하다. 본 포스트에서는 웹킷의 정의를 사전적으로 한 단어 한 단어 뜯어봄으로써 웹킷을 본질적으로 이해하는데 도움이 될 수 있도록 시도해 보았다. 아울러 WebKit.org에서 밝힌 웹킷 오픈소스 프로젝트의 목표를 살펴보고 웹킷이 무엇인지 파악하는데.. 현재 브라우저 대립관계 ㅎㅎ CSS 핵정리 - 핵과 필터 사용에 대한 주의사항 핵과 필터 사용에 대한 주의사항 CSS는 언어적인 측면에서 상위 버전 호환성을 잘 고려해서 설계되었다. 브라우저가 특정 선택자를 이해하지 못할 경우 해당 규칙을 전혀 적용하지 않게 된다. 마찬가지로 특정 속성이나 값을 이해하지 못할 경우 해당 선언을 모두 무시해버린다. 이런 기능으로 인해 새로운 선택자, 속성, 값이 추가되더라도 구버전의 브라우저에는 별다른 영향을 주지 않게 된다. 이런 특성을 이용하면 구식 브라우저에서도 안전하게 동작하면서도 최신 브라우저를 위한 규칙과 선언을 사용할 수 있다. 새로운 버전의 브라우저가 나올 경우 기존에 필터를 써야했던 CSS가 제대로 동작하게 될 것이다. 구버전의 브라우저에서 문제가 있어서 고급 CSS 기능을 사용했다면 새로운 버전에서는 이런 문제가 해결될 것이다. 이.. Customize Android Browser Scaling with target-densityDpi Customize Android Browser Scaling with target-densityDpi Webkit 사용 브라우저들 이미지 뭉개지는게 DPI 조정 때문이었구나. 메타 태그를 쓸 때 target-densityDpi를 device-dpi로 지정해주면 된다. 물론 이후의 가변폭을 위한 스케일링 같은건 자기가 알아서 해야한다. 자세한건 링크 참조.출처 : http://khrislog.net/post/3873961648/customize-android-browser-scaling-with CSS 높이(Height) 100% 맞추기(브라우저 창크기에 맞춰서) 높이 100% 첫번째 Hack을 사용한 100% 마추기 기본 소스 일단 DTD설정후 높이 100%라는것은 브라우저의 높이를 기준으로 하기때문에 container에 100%를 주면 전체 html의 높이는 gnb+ container + footer이 되어서 화면의 100%를 넘어선다 그럼 어떻게 잡아주는것이 좋을까? 먼저 DTD설정을 확인한다. (거의 필수) 본인은 DTD XHTML 1.0 Transitional 제작했다. (일단 많이 쓰이니깐..) 처음해줄것은 html과 body를 높이 100%를 주는것이다. Element같은경우 최상위의 높이를 기준으로 삼기떄문에 최상위인 html과 body에 높이 100%를 설정해준다 html, body {height: 100%; margin: 0; padding:0;.. 이전 1 다음
