애

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

· 2025-09-04 (목) 18:16:03 · 3419 · 2

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 가 반영됩니다.

 

 

|

댓글 2개

감사합니다.

감사합니다

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

그누보드5 팁자료실

2,788건
+
제목 글쓴이 날짜 조회
25-10-13 조회 3,317
25-10-12 조회 3,863
25-10-12 조회 3,265
25-10-12 조회 3,456
25-10-10 조회 3,279
25-10-10 조회 3,016
25-10-09 조회 3,469
25-10-08 조회 3,129
25-10-02 조회 3,253
25-10-02 조회 3,603
25-10-01 조회 3,049
25-09-29 조회 3,163
25-09-25 조회 3,404
25-09-25 조회 3,915
25-09-22 조회 3,585
25-09-19 조회 3,170
25-09-19 조회 3,494
25-09-16 조회 3,104
25-09-16 조회 3,267
25-09-12 조회 3,475
25-09-11 조회 3,090
25-09-09 조회 3,339
25-09-09 조회 3,219
25-09-08 조회 3,235
25-09-06 조회 3,514
25-09-05 조회 4,398
25-09-04 조회 3,420
25-09-04 조회 3,194
25-09-03 조회 3,486
25-09-03 조회 3,632