상세 컨텐츠

본문 제목

[HTML5&CSS3] 선형 그레디언트(linear-gradient)

Web/HTML5 & CSS3

by 클리엘 클리엘 2019. 11. 25. 13:38

본문

색상에 선형 그레디언트(linear-gradient)를 표현하려면 linear-gradient 함수를 사용할 수 있으며 해당 함수는 CSS3전용입니다.

<style type="text/css">
    div {
        background: linear-gradient(45deg, gray 10%, white 100%);
    }
</style>

첫 번째 속성의 값은 그레디언트를 그릴 각도이며 이어서 시작 색상 및 위치(% 단위)와 종료 색상 및 위치를 지정하면 됩니다.

'Web > HTML5 & CSS3' 카테고리의 다른 글

[HTML5&CSS3] 벤더 프리픽스(vendor prefix)  (0) 2019.12.05
[HTML5&CSS3] 선형 그레디언트(linear-gradient)  (0) 2019.11.25
[HTML5&CSS3] 그림자 효과  (0) 2019.11.19
[HTML5&CSS3] 위치  (0) 2019.11.13
[HTML5&CSS3] float  (0) 2019.11.08
[HTML5&CSS3] 폰트  (0) 2019.11.08

관련글 더보기

댓글 영역