프로그래밍(3)
-
캐시 무효화
캐시 무효화를 위한 응답 헤더 설정법Cache-Control: no-cache, no-store, must-revalidate Pragma: no-cache 💡 `Expires: 0` 응답 헤더를 함께 사용하는 경우도 있는데, 이는 문법 위반이며 몇몇 소프트웨어와 충돌할 가능성이 있으므로 사용을 지양해야 함 (응답을 받는 쪽에선 대비 필요) (우선순위 순. 함께 쓰였다면 후순위는 무시됨) Cache-Control: 캐시의 신선도를 관리하기 위한 헤더. 문서가 만료되기 전까지 얼마나 오랫동안 캐시될 수 있게 할 것인지 서버가 설정할 때 사용. (HTTP/1.1) no-store: 응답을 로컬 저장소에 저장하지 말라는 의미. (메모리에서만 사용하고 최대한 빨리 삭제하라) no-cache: 로컬..
2024.11.23 -
훨씬 더 정교해진 반응형 구현 방법: 컨테이너 쿼리
Media Query디바이스의 유형(인쇄물, 스크린 등)이나, 특성(디바이스의 방향, 터치 스크린 환경 등) 수치(화면 해상도, 뷰포트 너비 등)에 따라 레이아웃이나 스타일을 다르게 적용하고자 할 때 사용@media media-type and (media-feature-rule) { /* CSS rules go here */}▼ 뷰포트 너비가 360px 이하인 경우 텍스트 크기를 줄여 표시하기body { font-size: 11px;}@media screen and (max-width: 360px) { body { font-size: 11px; }}▼ 뷰포트 너비가 1920px 이상인 스크린이고 디바이스의 방향이 landscape(가로 방향)인 경우@media (min-width: 1920..
2024.11.22 -
Modern CSS Colors
종류예시Predefined/Cross-browser color namesredHexadecimal colors#05c3a7Hexadecimal colors with transparency (00 ~ FF)#05c3a7ffRGB colorsrgb(5, 194, 166)RGBA colorsrgb(5, 194, 166, 0.3)HSL colorshsl(171, 95%, 39%)HSLA colorshsl(171, 95%, 39%, 0.3)HWB colorshwb(171 2% 24%)currentcolorelement의 color 프로퍼티 값을 반영 ❗️ CSS Color Module Level 4부터 , 대신 (space)로 각 값을 구분할 수 있게 되었음Level 4는 아래 버전부터 지원함Chrome 103F..
2024.11.08