box-shadow

box-shadow

 

영역의 외각 그림자의 특징을 정의함.

 

[구조]

box-shadow : 그림자시작 x 위치 그림자시작 y 위치 그림자 퍼짐값 그림자색

 

[예제1]

 

<div style="position:absolute;left:50px;top:50px;

box-shadow: 10px 10px 10px #ccc;

border:1px solid #bbb;

width:100px;height:100px;">

 

</div>

 

 

[예제2] 그림자 퍼짐을 지정하지 않은 경우

 

<div style="position:absolute;left:50px;top:250px;

box-shadow: 10px 10px 0px #ccc;

border:1px solid #bbb;

width:100px;height:100px;">

 

</div>

 

 

[예제3] 그림자 시작 위치를 지정하지 않은 경우

 

<div style="position:absolute;left:250px;top:50px;

box-shadow: 0px 0px 30px #ccc;

border:1px solid #bbb;

width:100px;height:100px;">

 

</div>