CSS - Box Shadow

1. box-shadow

• 요소에 그림자 효과를 줄 수 있는 태그입니다.

• 요소에서의 그림자 위치, 선명도, 확산범위, 색상등을 정의할 수 있습니다.

box-shadow: 2px 2px 1px 1px yellow;
/* offset-x축, offset-y축, 그림자 선명도, 그림자 확산범위, 색상 */

1.2 box-shadow 사용

음수 y축

 box-shadow: 60px -16px teal;
/* x축 60px, y축 -16px, 색상 
   음수y축은 위로 이동 합니다. */

2가지 그림자 사용

box-shadow: 3px 3px red, -1em 0 .4em olive;
/* 우측으로 3px, 하단으로 3px, 빨강
   좌측으로 1em, 하단으로 0, 선명도 0.4em, 올리브*/