css gradient 그라디언트 효과

.main_section01{
    background: rgb(238,174,202);
    background: radial-gradient(circle, rgba(238,174,202,1) 0%, rgba(148,187,233,1) 100%);
}

.main_section01{
    background: linear-gradient(45deg,red,green,blue);
}

 

 

.main_section01{
    background: linear-gradient(45deg,red 40%,green 50%,blue) 60%;
}

퍼센트로 조절가능

 

 

https://cssgradient.io/

CSS Gradient — Generator, Maker, and Background

 

 

css 코드 복사 붙여넣기 

 

 

 

 

.main_section01{
    /* IE 하위버전용 */
    background: rgb(238,174,202);
    
    background: radial-gradient(circle, rgba(238,174,202,1) 0%, rgba(148,187,233,1) 100%);
}

위 코드는 익스 하위고정용 이 같이 나온다

 

 

 

 

radial-gradient

 

.main_section02 {
    background: radial-gradient(circle,red, green, blue);
}

동그라미는 각도가 안들어감