#CSS

총 32개의 글

반응형 웹 화면 크기 기준 완벽 정리 - 브레이크포인트 숫자부터 실전 미디어쿼리 작성법까지

768px? 1024px? 반응형 웹 화면 크기 기준을 어디에 맞춰야 할지 헷갈린다면, 부트스트랩과 테일윈드가 실제로 쓰는 브레이크포인트 수치와 모바일 퍼스트 작성법을 한번에 확인하세요.

FF0000이 왜 빨간색인지 아직 헷갈리시나요? HEX 색상 코드의 16진수 구조와 RGB 변환 원리, 3자리 축약 규칙, 투명도를 표현하는 8자리 표기법까지 실무에 바로 쓸 수 있게 정리했습니다.

코드를 고칠 때마다 저장하고 새로고침하기 지쳤다면, 실시간으로 결과가 보이는 HTML CSS 미리보기 도구를 써보세요. 온라인 도구 7가지 비교와 상황별 선택 기준을 정리했습니다.

tomato, gold, teal 같은 CSS 색상 이름은 총 148개입니다. 기본 16색부터 계열별 색상 그룹, darkgray가 gray보다 밝은 이유까지 실무에서 바로 쓰는 정보만 모았습니다.

디자인 시안의 HEX 코드를 CSS용 RGB 값으로 바꾸는 계산 공식과 브라우저 개발자 도구 활용법, 설치 없이 쓰는 무료 변환 도구까지 실무에서 바로 써먹을 수 있게 정리했습니다.

모니터는 1920px인데 브라우저는 1536px이라고 말합니다. 화면 해상도와 뷰포트의 차이, 그리고 그 차이를 만드는 기기 픽셀 비율(DPR)의 원리를 실제 기기 수치와 함께 쉽게 정리했습니다.

float와 position으로 씨름하던 레이아웃 작업, CSS 그리드는 코드 몇 줄로 끝냅니다. 핵심 속성 정리표와 카드형 레이아웃 실전 예제, 미디어 쿼리 없는 반응형 구현 팁까지 한 번에 확인하세요.

HEX 코드만 보면 막막했던 색 선택, HSL 색상 모델을 이해하면 달라집니다. 색상, 채도, 명도 숫자의 의미부터 CSS 활용법, 실무 배색 요령까지 한 번에 정리했습니다.

웹에서 매일 마주치는 #FF5733 같은 6자리 코드, 어떤 원리로 색이 되는 걸까요? 16진법 기초부터 색상코드 읽는 법, 실무 활용 팁까지 한 번에 정리했습니다.

브라우저마다 레이아웃이 깨지는 원인, 오타 하나일 수 있습니다. W3C CSS 유효성 검사기와 Stylelint로 CSS 오류를 자동으로 찾아내는 방법을 단계별로 정리했습니다.