linear-gradient 배경화면

jb kim·2021년 8월 14일
0

CSS

목록 보기
15/24

https://jbkim08.github.io/BackgroundGenerator/

linear-gradient

background: linear-gradient(red, blue);
background: linear-gradient(#e66465, #9198e5);
background: linear-gradient(to right, #3f87a6, #ebf8e1, #f69d3c);
background: linear-gradient(45deg, #3f87a6, #ebf8e1, #f69d3c);

방향 옵션

to bottom : 위에서 아래로 그라데이션을 만듭니다. (기본값)

to top : 아래에서 위로 그라데이션을 만듭니다.

to left : 오른쪽에서 왼쪽으로 그라데이션을 만듭니다.

to right : 왼쪽에서 오른쪽으로 그라데이션을 만듭니다.

ndeg : n도의 방향으로 그라데이션을 만듭니다.

1. 사이드바에 적용

  background-image: linear-gradient(to bottom, #e5e9dc, #FFF);
  /* background-color: #e5e9dc; */

2. 어떤 20년전 컴퓨터에 윈도우 비스타에 익스플로어

https://caniuse.com/?search=linear

적어도 녹색 사이드바는 보여지도록한다.

  background-color: #e5e9dc;
  background-image: linear-gradient(to bottom, #e5e9dc, #FFF); 
profile
픽서

0개의 댓글