# chrome

15개의 포스트

크롬 개발자모드에서 마우스 좌표 찾기

개발자 모드에 아래 코드 입력원하는 위치에 마우스 커서를 두고 아래 코드 입력

1일 전
·
0개의 댓글

퍼펫티어에서 $(), $$()

크롬개발자 모드나 퍼펫티어에서 $()나 $$()를 사용할 수 있다.$('div') = document.querySelector('div');해당 엘레먼트들이 여러개인경우엔 제일 첫번째꺼 선택$$('div') = document.querySelectorALL('div')

2020년 9월 17일
·
0개의 댓글
post-thumbnail

TIL : Chrome 개발자 도구(DevTools)

오늘은 프론트엔드 개발자라면 필연적으로 친해져야 한다는 개발자 도구(DevTools)에 대해 공부했다.그전까지 이름은 몰랐지만, html과 css를 공부할 때 이미 몇 번 확인해본 적 있는 툴이었다. 개발자 도구는 맥북 기준으로 크롬에서 command + option

2020년 9월 17일
·
0개의 댓글
post-thumbnail

맥에서 크롬이 열리지 않는 현상 해결 방법

맥에서 크롬을 설치하고 실행해도 아무런 반응이 없이 자동으로 크롬이 종료되는 현상을 발견했습니다. 크롬을 지우고 다시 깔아봐도 똑같은 현상만 반복...크롬을 설치한 상태에서 진행합니다.런치패드 > 기타 > 터미널터미널에 다음 명령어를 입력합니다.터미널에 다음 명령어를

2020년 9월 3일
·
0개의 댓글
post-thumbnail

크롬 탭 관리 방법 - 탭 그룹

무수히 많은 크롬 탭 때문에 불편함을 느끼셨던 분들을 위해 크롬 83부터 적용 된 탭 그룹 설정 방법을 소개합니다.

2020년 8월 28일
·
0개의 댓글
post-thumbnail

💌크롬에서 게시글 암복호화하기

Confluence 를 사용하던 중에 민감 정보(패스워드, 서버 정보 등)를 게시하는데 불편한 점이 있었다. 유료 플러그인을 사용하면 해결 될 문제지만 사용량이 적은 상태에서 유료 플러그인을 쓰기에는 부담되는 건 사실이다. 그렇다고 별도로 관리하려니 생각할 게 많아서

2020년 8월 26일
·
0개의 댓글
post-thumbnail

TIL. 크롬 개발자 도구 (element, network, console, application)

Elements html 코드를 분석하고 수정할 수 있는 도구 패널이다. Dom과 css를 자유롭게 조작하여 사이트의 레이아웃과 디자인을 테스트 할 수 있다.

2020년 8월 21일
·
0개의 댓글
post-thumbnail

Github 활용도를 높여 주는 크롬 확장도구 Octotree

깃허브 활용도를 높여주는 크롬에서 제공하는 확장 도구를 알아보자.깃허브 하나의 저장소에는 많은 폴더와 파일이 존재 한다.폴더와 파일을 찾기위해 클릭하고 또 클릭하고 ... 원하는 내용을 찾아보기 쉽지 않다.octotree는 이러한 문제를 해결하도록 도움을 준다.크롬 확

2020년 7월 3일
·
0개의 댓글
post-thumbnail

크롬으로 디버깅하기

크롬 개발자 도구의 Sources패널로 디버깅을 할 수 있다.버튼을 클릭하면 greetinf함수가 실행되며, h, w변수에 차례대로 값이 할당된 후 인풋 태그에 결과 값(helloworld)이 출력되는 구문이다.크롬 개발자 도구의 소스탭을 들어가면 아래 처럼 확인할 수

2020년 6월 6일
·
0개의 댓글
post-thumbnail

[Ubuntu 20.04]Google Chrome 설치하기

Ubuntu 20.04 Chrome 설치하기

2020년 5월 22일
·
0개의 댓글
post-thumbnail

크롬 콘솔창을 통해 디버깅 시 주의할 점

크롬 콘솔창을 통해 데이터를 로깅할 때, 출력된 데이터가 로그가 찍힌 시점의 데이터가 아닐 수도 있다는 사실을 알고 계셨나요?

2020년 5월 17일
·
0개의 댓글
post-thumbnail

밝은 화면에 눈이 아픈 당신!

Chrome 의 확장프로그램. 다크리더를 사용해보세요 !

2020년 5월 7일
·
0개의 댓글
post-thumbnail

크롬 익스텐션 제작기

짧은 일기형식의 글컴퓨터로 유튜브를 보다가 밥을 먹으려고 나(우리)의 친구 스마트폰을 들고 나가려는데, 보던 영상을 스마트폰으로 그대로 보고싶다고 생각했다. 나는 유튜브 시청 기록을 중단해 놔서 스마트폰에서 이어보려면 직접 검색해서 들어가야 한다. 그래서 더 편한 방법

2020년 5월 7일
·
1개의 댓글
post-thumbnail

개발자 도구

작성된 HTML들과 styles(css)을 볼 수 있다.styles탭을 보면 css가 적용되는 우선순위로 나누어져 있는 것을 알 수 있다. \* 여기서 우선순위는 선택자에 의한 우선순위나 상속관계에 의한 css적용순위 그리고 sheet들중의 우선순위에 의한 우선순위.원

2020년 4월 24일
·
0개의 댓글
post-thumbnail

⚡️ Google Chrome Labs의 Quicklink로 웹페이지 UX 향상시키기

이 글에서는 Google Chrome Labs에서 2018년 11월에 공개한 quicklink에 대해 알아보고 간단하게 사용해보는 방법을 다룹니다.

2019년 2월 17일
·
4개의 댓글