크롬 f12 개발자모드 보는방법
본문
안녕하세요. 장님이 물건 만지듯 뜨문뜨문 배워가고있는 초보입니다.
메인화면 수정을 하려고하는데 f12로 파일을 찾는 방법을 알려주시면 감사하겠습니다.
f12를 누르고 좌측상단에 마우스로 수정하고싶은 부분을 클릭하거나,
마우스로 수정하고싶은 부분 우클릭후 '검사'를 누르면 오른쪽 화면에 위의 사진처럼
나타나는것까지는 알고있습니다.
중요한것은 좌측에 html이 쭈욱 나오는데
저 파일 경로를 어떻게 찾는것인지 모르겠어요
q&a에서 크롬 f12로 검색하니 오른쪽 상단에 나타나는 경로 찾는방법은 나와있던데
왼쪽편은 어느곳에서 찾아야할지 도저히 모르겠더군요.
초보답게 파일 하나하나 뒤져보다가 GG치고 전문가분들께 조언좀 요청드립니다.
답변 1
많이 찾아들어가셨네요
좌측상단의 표기된 박스+화살표 모양을 누르시고
F12는 탭별로 작동합니다.
개발자도구를 열은 탭으로 이동하여 영역을 선택하면 해당 영역이
개발자도구에 함께 선택되어 표기되고, 우측에 그 영역에 영향을 주는CSS 도 나타납니다.
css영역에서 파일명에 표기된 숫자는 css의 라인수 이고
클릭하면 해당 css의 해당영역으로 이동하여 확인가능합니다.
이후는 직접 천천히 눌러보시면서 찾아가시는게 중요하고
절대로 성급하게 찾지 마시고
단순한 사이트부터 천천히 살펴보시면
익숙해진이후에는 복잡한 사이트도 충분히 접근가능하실겁니다.
답변감사합니다^^ 저는 따로 파일이 있는건줄 알았네요 차근차근 배우도록 하겠습니다.
답변을 작성하시기 전에 로그인 해주세요.
