Editing

<gradient>

두 가지 이상의 색상 간 점진적인 전환으로 구성된 특수한 유형의 이미지를 나타낸다.

<gradient>는 <image>에 속하는 하위 타입이라 볼 수 있다. 하지만 <image>와는 다르게 <gradient>는 원본 크기라는 개념이 없다. 대신에 그라데이션을 적용하는 요소의 크기와 동일해 진다.

background: linear-gradient(to right, #FF0000, #00FF00, #FFFF00);

선형 그라데이션

Example

background: radial-gradient(#FF0000, #00FF00, #FFFF00);

원형 그라데이션

Example

Modules

Module Name Status Summary

Modules
CSS Images Module Level 3	편집자 초안	Last review date: 2022-6-3
CSS Images Module Level 4	편집자 초안	`element()`, `image()`, `image-set()`, `conic-gradient()`, `repeating-conic-gradient()`, `image-resolution()` 함수가 새롭게 추가되었으나 아직은 모든 웹브라우저에서 지원되지 않는다. Last review date: 2022-6-3

편집자 초안

Last review date: 2022-6-3

편집자 초안

element(), image(), image-set(), conic-gradient(), repeating-conic-gradient(), image-resolution() 함수가 새롭게 추가되었으나 아직은 모든 웹브라우저에서 지원되지 않는다.

Last review date: 2022-6-3

CSS Reference
HTML
JavaScript
Development