테스트 사이트 - 개발 중인 베타 버전입니다

브라우저 F12 개발자 모드에서 현재 적용된 CSS 찾기.

· 2개월 전 · 293 · 1

1.

브라우저에서 F12 를 눌러 개발자 툴을 열어줍니다.

 

3698860916_1756977242.1426.gif

 

그리고 좌측 상단의 3698860916_1756977263.4883.png 아이콘을 누르고

브라우저에서 찾고 싶은 영역을 클릭 합니다.

 

 

 

3698860916_1756977293.2258.gif

 

그러면 위 스크린샷 처럼 해당 엘리먼트에 적용된 CSS 가 나오는데

css 파일에 마우스를 대면 위치가 나옵니다.

 

해당 CSS 를 수정하시면됩니다.

 

추가팁1.

두번째 스크린샷 처럼 CSS 가 오른쪽 창에 나와있을때 해당 CSS 를 직접 변경하시면

현재 브라우저에도 임시로 반영이 됩니다. (폰트 크기나 색상 등등..)

이후 다시 되돌리고 싶으면 F5 새로고침을 하면 됩니다.

 

추가팁2.

CSS 파일을 찾아서 수정 했는데도 적용이 안될때에는

쉬프트+F5 를 눌러 수~~퍼 새로고침을 하면 캐시가 갱신되어 새로 수정한 css 가 반영됩니다.

 

 

댓글 작성

댓글을 작성하시려면 로그인이 필요합니다.

로그인하기

댓글 1개

감사합니다.

게시글 목록

번호 제목
24318
24317
24315
24309
24294
24293
24277
24262
24260
24253
24251
24236
24233
24228
24226
24221
24214
24203
24201
24199
24196
24195
24194
24192
24191
24187
24185
24183
24172
24168