모든 css 적용 관련 문의드립니다!
본문
안녕하세요!..
css 적용 관련 검색해보다가 결국 해결되지 않아 문의드리게되었습니다.
테마를 사용해서 css 적용했고, 서브페이지는 별도로 폴더만들어서 각각 css 적용해놨습니다.
바로 반영이 안될때 마다 version.extend.php 이걸로 수정해주면 바로 반영될 수 있었는데요.
이젠 그마저도 안되네요 왜갑자기 안되는 이유를 모르겠습니다.
html에 인라인으로 스타일 적용하면 바로 되는데 기존 스타일 시트를 수정하면 캐쉬 삭제 뭐든 방법 다 써봐도 바뀌질않습니다..ㅠ
신기한건 css 파일을 ftp에서 지워도 고대로 적용된걸로 보인다는 거구요..
css를 게속 수정하면서 새로고침으로 보면서 해야하는데 바로 바뀌질않으니 너무 불편하구요.
css 이름을 게속 다른걸로 수정해서 올려놓으면 바뀌긴 합니다.
어떤 부분의 문제인지 고수님들 조언 부탁드립니다! ㅠ
답변 4
브라우저 어떤걸 쓰시는지 모르겠습니다.
새로고침을 강하게 할 필요가 있으지도 모릅니다.
Ctrl + r, Ctrl + F5, Ctrl + Shift + F5
브라우저 옵션중에 단축키 찾아 보시면 있을겁니다.
저도 적용이 안되서 저리 씁니다.
참고로 네이버 웨일 쓰고 있습니다. (Ctrl + Shift + F5)
전 크롬써요! 말씀하신거처럼 저도 Ctrl + F5, Ctrl + Shift + F5 이방법 다했던건데 안되서 문의드렸던거라 ㅠ.ㅠ
개인서버 쓰시나요? 호스팅 쓰시나요?
저도 별짓 다 했다가 결국 브라우저 초기화 하고 해결 봤습니다.
이후 간단한 방법이 있었다는걸 알고 머리를 쥐어 박은적이 있습니다.
해당 증상이 일반적이지는 않습니다.
그렇다고 매번 파일명 바꿔 올리시는 것도 할 짓은 아닌거 같구요.
브라우저에서 해결이 안된다면 더 위로 가야죠.
그러기 위해서 다른 브라우저에서도 테스트를 해 보셔야 하고
동일한 증상이 다른 브라우저에서도 나온다면
정말 그 위를 의심해 봐야 하지 않을까 합니다.
설명감사합니다..ㅠ 호스팅사용하는데요..
혹시 어떤방법으로 해결하신건지 의견좀 주실수있을까요?
아니면 퍼미션 때문에라도 안될 수가 있나여?ㅠ
다른 브라우저도 동일한 증상인가요?
그렇다면 호스팅 업체쪽에 문의를 해 보셔야 합니다.
호스팅 어디 쓰시나요?
저는 브라우저 초기화로 해결했습니다.
https://meaownworld.tistory.com/89 이 글도 참고가 될수 있을겁니다.
브라우저 초기화 전에 css 이후의 ?ver 부분 날렸더니 정상적으로 보여서
브라우저 문제구나 생각하고 초기화 한거니까요.
감사합니다!^^
ftp에서 파일을 지웠는데 css가 적용된다고 하시는데
클라우드플레어 같은 서버 전단에 캐시서버가 존재하는건가요?
테마 / 서브페이지 모두 동일 증상인가요?
CSS 자동압축 같은 플러그인을 사용하시는건가요?
제가 그누보드를 잘 아는건 아니라서..ㅠ_ㅠ 다른 프로그램을 쓴건 없었어요!
테마 서브페이지 모두다 적용이 안되고있어요 ㅠ그래서 계속 파일 다운로드해서 별도 수정하고 다시 다른이름으로 넣고있습니다 ㅠㅠ일일히
.htaccess 파일이 없다면 그누보드 설치폴더 루트에 생성하시고 있다면 아래 내용을 한번 넣어보시길 바랍니다. 아래 소스는 html5-boilerplate 일부입니다.
https://github.com/h5bp/html5-boilerplate/blob/ffd36de013ff00e2623c6ea35675b1c4763a4524/dist/.htaccess#L1060
<IfModule mod_expires.c>
ExpiresActive on
ExpiresDefault "access plus 1 month"
# CSS
ExpiresByType text/css "access plus 0 seconds"
# Data interchange
ExpiresByType application/atom+xml "access plus 1 hour"
ExpiresByType application/rdf+xml "access plus 1 hour"
ExpiresByType application/rss+xml "access plus 1 hour"
ExpiresByType application/json "access plus 0 seconds"
ExpiresByType application/ld+json "access plus 0 seconds"
ExpiresByType application/schema+json "access plus 0 seconds"
ExpiresByType application/geo+json "access plus 0 seconds"
ExpiresByType application/xml "access plus 0 seconds"
ExpiresByType text/calendar "access plus 0 seconds"
ExpiresByType text/xml "access plus 0 seconds"
# Favicon (cannot be renamed!) and cursor images
ExpiresByType image/vnd.microsoft.icon "access plus 1 week"
ExpiresByType image/x-icon "access plus 1 week"
# HTML
ExpiresByType text/html "access plus 0 seconds"
# JavaScript
ExpiresByType application/javascript "access plus 1 year"
ExpiresByType application/x-javascript "access plus 1 year"
ExpiresByType text/javascript "access plus 1 year"
</IfModule>
주신내용 해봣는데 여전하네요 ㅠㅡㅠ 흑흑
감사합니다..ㅠ 해당링크도 확인 해봤던거라서 ..ㅠ
캐시 새로고침 했는데 안 되는 거라면,
십중팔구 우선순위에서 밀려서 그렇습니다.
혹시 죄송하지만..ㅠ 우선순위라는건 css 뒤에 숫자 매기는거 말씀하시는건가용?
아래 좌표글들 참고해 보세요.
https://homzzang.com/b/css-5
https://homzzang.com/b/css-278
크롬 브라우저의 검사 기능을 통해 적용되고 있는 css 를 확인할 수 있습니다. https://www.jbfactory.net/10866
(css 적용 내용 확인하고자 하는 영역에 마우스 -> 마우스 우클릭 -> 검사)
적용된 css 영역에서 우선순위가 높은 것부터 상단에 나옵니다. 그리고 적용된 css 파일과 라인도 확인할 수 있습니다. (css 파일명에 마우스를 올리면, css 파일의 풀경로를 확인할 수 있습니다.)
1) 내가 수정한 부분이 상단에 나온는지 하단에 나오는 지 확인 (하단에 나오면 다른 css 파일이 우선순위로 적용된 것입니다.)
2) 내가 수정한 파일이 맞는데.. 수정한 부분이 적용되지 않았다. => 캐시 문제일 가능성이 높습니다.
내가 수정한 파일의 css 에 ?v=123123 식으로 버전명을 갱신하거나 /extend/version.extend.php 등을 살펴볼 수 있습니다.
