- 2009/09/08 Google Chrome (구글 크롬 DEV) Developer Tools 기능 (19)
Yaluka's Web » Search » Results » Articles
Developer Tools와 관련된 글 1개
Google Chrome (구글 크롬 DEV) Developer Tools 기능
얄루카 | 2009/09/08 17:48
Firefox의 부가기능인 Firebug과 비슷한 기능이 Google Chrome에도 있습니다.
실행된 모습입니다.
Firebug에 대한 정보는 쿠나님 포스트가 있으니 한번 보시는 것도 좋겠습니다.
이 기능은 Google Chrome 4에서 따로 설치하지 않고 내장되어 있는 기능입니다. (4.0.206.1버젼을 중심으로 작성되었습니다.)
구글 크롬4를 사용하신다면 Developer Tools의 기능을 사용하실 수 있을거라 생각되네요. (4.0.203.4 버젼에서는 이기능이 작동하지 않습니다. 현재 최신 버젼인 4.0.206.1 버젼으로 업데이트하시면 정상적으로 작동됩니다.)
정식 버젼인 2.0 버젼대는 잘 모르겠습니다.(테스트 해보지 않아서..^^;)
Developer Tools 실행하기
마우스 오른쪽 클릭으로 요소 검사(N)을 클릭하여 실행합니다.
또는
또는
현재 페이지 관리 > 개발자 정보 > Developer Tools를 클릭합니다.
Developer Tools Elements 기능
수정할 부분을 더블클릭해서 수정할 수 있고
하단에 돋보기 모양을 클릭한후 보고싶은 소스의 부분을 클릭하시면
저는 이미지를 클릭했습니다.
이미지 태그가 바로 창에 뜹니다.
이런식으로 HTML,CSS,JS를 쉽게 수정하셔서 테스트 해보는 과정을 거치실 수 있습니다.
Developer Tools Resources 기능
이 기능은 페이지의 로딩 속도를 측정하는 기능 입니다.
Enable resource tracking 을 클릭합니다.
페이지 로딩속도가 표시되네요.
제 블로그는 평균 1.5~2.0초 가 걸리네요 ㅠㅠ 이거 반성하면서 속도를 높여야겠습니다 orz..
아래에는 이미지,스크립트,CSS 로딩속도가 표시됩니다.
다른기능들도 더있습니다만, 여기까지만 적겠습니다^^;
트랙백 4개 | 댓글 19개
트랙백+댓글 | 트랙백 | 댓글
-
About Trackback
트랙백 기능을 이용하시면 이 밑부분에 당신의 글을 댓글처럼 달아놓으실 수 있습니다. 이 글의 트랙백 주소는 http://blog.yaluka.com/trackback/87 입니다.
-
Trackback from NiCo of ScanMAC
모질라 파이어 폭스(Mozilla Firefox) v3.5.3 새 버전 출현 소식
모질라 파이어 폭스(Mozilla Firefox) v3.5.3이 방금전에 출현되었습니다. 모질라 파이어 폭스(Mozilla Firefox) v3.5.2 다운 받기 [관련글] 모질라 파이어폭스(Mozilla Firefox) 브라우저와 플러그인 베스트 그리고 Tip/ 2009/09/10 02:07 / delete
-
Trackback from StoryBlog v5.5
오페라 웹표준 강좌 48장, 동적 스타일 - 자바스크립트로 CSS 다루기
클리어보스에서 번역중인 오페라 웹표준 강좌의 48장 동적 스타일 - 자바스크립트로 CSS 다루기가 번역 되었습니다. 검은태양님께서 수고해 주셨습니다. 근래 들어 검은태양님께서 너무 열심히 번역에 참여해 주고 계셔서 한 주에 한 강좌씩 꼬박 꼬바 등록되고 있는것 같습니다. 너무 너무 감사드립니다. 저 역시도 어서 진행중인 부분을 완료해서 올리도록 해야겠습니다. 소개 스타일시트에 접근하기 스타일시트 속성 규칙을 추가하거나 제거하기 요소의 스타일 변경하기../ 2009/09/10 16:42 / delete
-
Trackback from zwoo아빠 Blog
구글 크롬에는 -enable-extensions 이라는 옵션을 줄 수 있었습니다. 따라서 언젠가는 크롬도 파이어폭스 처럼 확장기능을 지원하리라.. 생각은 하고 있었습니다. 그리고 이번에 몇가지 크롬의 확장이 나와서 소개를 합니다. (물론.. 요즘 사용중인 크롬플러스에도 당근 설치 가능합니다.) 1. Bubble Translate (설치하기) 구글툴바등에 보면 웹페이지의 특정 단어를 클릭하면 한글로 뜻을 보여주는 기능에 해당한다고 보시면 됩니다. 구글../ 2009/09/11 09:34 / delete
-
Trackback from zwoo아빠 Blog
하나의 모니터를 사용하면서 웹서핑을 하다보면.. 창을 두개를 띄우고 동시에 보고 싶은 경우가 생깁니다.. 그런데 크롬에서 창을 분할해서 볼 수 있는 기능을 발견(?)하여 글을 올립니다. (몰랐는데 구글 크롬 도움말에도 나와있는 기능이었습니다..ㅠㅠ) 그림을 보시면 크롬의 탭하나를 떼어내서 1부터 5번 숫자에 해당하는 위치에 탭을 가져가면 아래와 같이 화면이 분할되어 보여집니다. 1. 모니터 위쪽 가운데: 버튼을 놓으면 탭이 새 창에 최대화 상태로 표../ 2009/09/14 15:43 / delete
-
옥수 at 2009/09/08 21:28 / Permalink / Reply / Modify/Delete으허억! 보는 것 만으로도 현기증이...!
무서웟!<<머리가 돌인 어느 인간의 절규-
Reply by
얄루카 at 2009/09/09 21:10 / Permalink / Modify/Delete어헉 ㅠㅠ
-
-
녹풍 at 2009/09/09 13:49 / Permalink / Reply / Modify/Delete어라 이 기능은 원래 있던 기능 아닌가요?
-
Reply by
얄루카 at 2009/09/09 15:45 / Permalink / Modify/Delete네 원래 있는 기능을 소개해드린 겁니다^^
정식 버젼이나 BETA 버젼은 어떤식으로 작동하지 잘 몰라서 말이죠^^;
-
-
카이토 at 2009/09/10 01:36 / Permalink / Reply / Modify/Delete뭔지 모르겠다는...ㄷㄷㄷ
얄루카님 마저 괴물이라니...-
Reply by
건탱이 at 2009/09/11 22:02 / Permalink / Modify/Delete본격 괴물 얄루카님 ㅎㄷㄷ
-
Reply by
얄루카 at 2009/09/12 07:58 / Permalink / Modify/Delete괴물이라뇨 ㅠㅠ
알고보면 쉬운 부분인데 orz..
-
-
Kael H. at 2009/09/10 10:23 / Permalink / Reply / Modify/Delete복잡한 코드를 보고 자동으로 손이 휠을 돌리더군요.(퍽)
-
Reply by
얄루카 at 2009/09/12 07:58 / Permalink / Modify/Delete으헝헝 …
-
-
푸우~~ at 2009/09/10 23:49 / Permalink / Reply / Modify/Delete이런건 어려워요.....ㅜ.ㅜ;;;;;;;;;;
저 댓글란에 있는 사진을 보고 도져히 댓글을
무시할수없어서 남깁니다......
네히!!! 댓글 대령햇습니다~~~~-
Reply by
얄루카 at 2009/09/12 07:59 / Permalink / Modify/Delete헉 ! 감사합니다^^
-
-
번드피닉스 at 2009/09/12 00:20 / Permalink / Reply / Modify/Delete으윽;;; 난 이런건 초면이라... 댓글 달고 싶어도 뭘 아는게 없으니.. 크윽..
...-
Reply by
얄루카 at 2009/09/12 07:59 / Permalink / Modify/Deleteㅠㅠ
-
-
아후라 at 2009/09/12 23:18 / Permalink / Reply / Modify/Delete좋은 정보 감사합니다.
댓글 달지 못할까.!! 라는 멘트에 쫄았습니다. ㅎㅎ-
Reply by
얄루카 at 2009/09/18 22:44 / Permalink / Modify/Delete흑흑 그럴의도는 아니였지만 ><
도움이 되셨으면 하네요^^
-
-
싱싱차이나 at 2009/09/17 07:36 / Permalink / Reply / Modify/Delete이런 전문적인 기능도 있었군요~
방금 크롬 개발자 버전 설치했는데...
근데 개발자모드 들어가서 만지는 건 두렵네요~
완전 맹해서~^^
잘 읽고 갑니다.-
Reply by
얄루카 at 2009/09/18 22:44 / Permalink / Modify/Delete도움이 되셨기를 바랍니다^^;
-
-
그런데그것이실제로 at 2009/10/07 01:43 / Permalink / Reply / Modify/Delete우와아
-
워나힐 at 2009/11/29 11:59 / Permalink / Reply / Modify/Delete멋진 기능이군요. 전 HTML을 몰라 못 쓰겠지만요.......;ㅅ;
-
Write your comment
