CSS 파일 수정 후 적용이 안될 때

이번에 웹 프로젝트를 하며 CSS 파일을 수정했는데, 실행 시 적용이 안되는 문제가 있었습니다.

 

원인은 브라우저가 캐시에 담아둔 이전 CSS 정보를 갱신하지 못했기 때문입니다.

 

이에 대한 해결방법을 소개합니다.

 

 

 

링크 태그 URL 수정

---

<!-- 변경 전 -->
<link rel="stylesheet" href="style.css">

<!-- 변경 후 -->
<link rel="stylesheet" href="style.css?문자열">

CSS 파일을 연결한 HTML 파일의 link 태그의 URL을 위 코드와 같이 수정해줍니다.

 

파일의 경로 뒤에 ?문자열을 더해 캐시에 CSS 파일을 새로이 인식시켜주면 됩니다.

 

? 뒤 문자열에는 어떤 문자열을 넣어도 상관 없으니 아무 문자열이나 넣어주시면 됩니다.

 

이제 변경 후 CSS 파일을 저장한 뒤 파일을 다시 실행시켜보면 변경사항이 바로 적용된 모습을 볼 수 있습니다.