Chrome DevTools에서 변경한 CSS 변경 사항을 어떻게 영구적으로 저장할 수 있나요?

Chrome 개발자 도구 스타일 패널에서 CSS 변경 사항 유지

문제 설명:

CSS 수정 사항을 저장할 수 없습니다. 리소스에 표시되어야 한다고 제안하는 문서에도 불구하고 Google Chrome 개발자 도구의 스타일 패널 panel.

해결책:

이제 Chrome에서는 작업공간에 로컬 폴더를 추가하는 기능을 제공합니다. 이 기능을 활용하면 웹 리소스를 로컬 리소스에 매핑하고 개발자 도구에서 직접 CSS 변경 사항을 저장할 수 있습니다.

단계:

1. 작업 공간에 폴더 추가:

   • 다음으로 이동합니다. 개발자 도구의 소스 패널.
   • 왼쪽 패널을 마우스 오른쪽 버튼으로 클릭하고 "작업 공간에 폴더 추가"를 선택합니다.
   • CSS 파일이 포함된 폴더를 선택합니다.

2. Chrome 부여 액세스:

   • 폴더 액세스 권한을 요청하는 메시지가 나타납니다.
   • Chrome 액세스 권한을 부여하세요.

3. 네트워크를 로컬로 매핑 리소스:

   • 페이지를 다시 로드합니다.
   • 소스 패널에서 해당 매핑된 파일을 찾습니다.
   • 파일 이름을 마우스 오른쪽 버튼으로 클릭하고 "맵"을 선택합니다. 파일 시스템 리소스로 이동합니다."
   • 로컬 파일로 이동하여 다음을 선택합니다.

4. 변경 사항 저장:

   • 매핑된 파일에서 CSS를 변경합니다.
   • Ctrl S를 눌러 저장하세요.

추가 참고 사항:

• 응용 프로그램을 시작하려면 매핑된 파일을 열고 편집해야 할 수도 있습니다. 로컬 변경 사항.
• 스타일 패널이 표시되지 않으면 요소 패널의 오른쪽 상단에서 '스타일 표시'를 선택하세요.

위 내용은 Chrome DevTools에서 변경한 CSS 변경 사항을 어떻게 영구적으로 저장할 수 있나요?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!