2012-02-11 8 views
1

Im은 내 상자의 안쪽과 아래쪽에 그림자를 넣으려는 시도이지만 작동시키지 못합니다. 이 일을하는 방법에 대한 좋은 설명을 갖고 나를 도울 수있는 사람이 있습니까?Oposite place의 CSS 그림자

-moz-box-shadow:0 5px 5px rgba(128,128,128,0.1); 
-webkit-box-shadow: 0 5px 5px rgba(128,128,128,0.1); 
box-shadow: 0 5px 5px rgba(128,128,128,0.1); 
+0

의견보기;). 상자 안에 그라디언트를 넣고 싶다면 CSS를 사용하여'background-image : -moz-linear-gradient (top, # 333333, # 222222);와 같은 그라디언트를 만들 수 있습니다. –

+0

에 대한. 하지만 고마워! –

답변

2

어쩌면 그럴 것 같은가요?

-moz-box-shadow: inset -5px -5px 5px 5px rgba(128,128,128,0.1); 
-webkit-box-shadow: inset -5px -5px 5px 5px rgba(128,128,128,0.1); 
box-shadow: inset -5px -5px 5px 5px rgba(128,128,128,0.1); 
+0

매우 차갑고, 나는 인셋으로 새로운 것을 배웠습니다! –

+0

그건 맞지 않아. –

+0

그림자가 오른쪽에도 있기 때문에 맞지 않습니까? –

0

다음과 같이 할 수 있습니까?

-webkit-box-shadow:  0 1px 3px rgba(255,255,255,0.5), 
         0 2px 3px rgba(255,255,255,0.5), 
         0 3px 0px rgba(0,0,0,0.3); 
    -moz-box-shadow:  0 1px 3px rgba(255,255,255,0.5), 
         0 2px 3px rgba(255,255,255,0.5), 
         0 3px 0px rgba(0,0,0,0.3); 
     box-shadow:  0 1px 3px rgba(255,255,255,0.5), 
         0 2px 3px rgba(255,255,255,0.5), 
         0 3px 0px rgba(0,0,0,0.3); 
: 그것은 당신이 같은 (다수의 일반 박스 그림자와 삽입 시뮬레이션)을 시도 할 수있는 대안하지만 왼쪽과 오른쪽 측면에 작은 틈 ...

-webkit-box-shadow: inset -1px 3px 3px rgba(255,255,255,1), 
        inset 1px 3px 3px rgba(255,255,255,1), 
        inset 0px -3px 3px rgba(0,0,0,0.3); 
    -moz-box-shadow: inset -1px 3px 3px rgba(255,255,255,1), 
        inset 1px 3px 3px rgba(255,255,255,1), 
        inset 0px -3px 3px rgba(0,0,0,0.3); 
     box-shadow: inset -1px 3px 3px rgba(255,255,255,1), 
        inset 1px 3px 3px rgba(255,255,255,1), 
        inset 0px -3px 3px rgba(0,0,0,0.3); 

또는 잎

불행하게도, 이것은 취소 그림자로부터 하얀 빛의 경고를받습니다.