카테고리: CSS Reference

css reference background image 01

CSS / Reference / background-image

배경 이미지의 주소 기준과 여러 레이어의 순서를 설명합니다. 인라인 SVG 예제로 실행하고 외부 CSS의 상대 경로와 요청 실패를 확인합니다.

css reference background origin 01

CSS / Reference / background-origin

배경의 위치·크기 기준을 content·padding·border 영역으로 바꾸어 비교합니다. clip과의 차이 및 백분율 크기 기준을 수치로 확인합니다.

css reference font family 01

CSS / Reference / font-family

글꼴 후보 순서와 문자별 대체 선택을 이해하고 실제 렌더링 글꼴을 확인합니다. 일반 계열의 표기와 웹 폰트 제공·로딩 조건을 설명합니다.

css reference background color 02

CSS / Reference / background-color

배경색의 알파 합성과 요소 전체 투명도를 구분합니다. 최종 글자·배경 조합에서 대비를 검사하고 이미지 뒤의 대체 색을 설정하는 기준을 설명합니다.

css reference opacity 01

CSS / Reference / opacity

요소 전체 투명도와 배경 알파를 구분합니다. opacity 0에서도 키보드 조작이 남는 예제로 공간·포커스·표시 여부의 차이를 확인합니다.

css reference text shadow 05

CSS / Reference / text-shadow

텍스트 그림자의 위치·흐림·레이어 순서를 조정합니다. 박스 그림자와의 차이, 잘림 및 실제 글자 대비를 함께 점검합니다.

css reference box shadow 01

CSS / Reference / box-shadow

박스 그림자의 위치·흐림·확산·겹침 순서를 조정합니다. 한 값씩 바꾸는 실습으로 그림자가 레이아웃 크기와 상위 잘림에 미치는 관계를 확인합니다.

css reference background clip 01

CSS / Reference / background-clip

배경을 border·padding·content 영역 또는 텍스트에 맞춰 자릅니다. 위치 기준과의 차이, 투명 글자의 대체 색과 강제 색상 환경을 확인합니다.

css reference font weight 01

CSS / Reference / font-weight

숫자 굵기와 상대 굵기를 지정하고 실제 지원 서체를 확인합니다. 정적·가변 글꼴의 차이와 여러 요청이 같은 모습으로 나오는 이유를 설명합니다.

css reference font style 02

CSS / Reference / font-style

italic·oblique의 요청과 실제 글꼴 선택을 구분합니다. 서체 파일, 합성 기울임, 의미 있는 강조와 font 단축 속성의 영향을 확인합니다.