2015-01-29 3 views
0

이것은 간단해야하며 그림자를 원하지만 사각형의 안쪽에 원한다. Google에서 장소를 찾고 있는데 찾지 못했습니다.CSS 3 내부 드롭 섀도우

enter image description here

+4

을 당신은'inset' 재산 https://developer.mozilla.org/en-US/docs/를 사용할 필요가 웹/CSS/박스 - 섀도우 – antyrat

답변

1

당신은 충분히 열심히 보이지 않았다.

box-shadow: inset 2px 2px 3px 3px #333333; 
+0

이전에 보았지만 다시 찾을 수 없었습니다. 감사! 왜 -1일까요? –

+2

[좋았어.] (http://stackoverflow.com/help/be-nice) 또한 "inset"보다는 "inse ** r ** t"를 사용했습니다. – JDB

+0

@ TheHawk - 왜 신맛이 귀하의 질문에 싫어하는 것으로 추측합니까? 24 명의 사용자가 귀하의 게시물을 지금까지 보았습니다. – JDB

1

inset box-shadow을 사용하십시오.

div { 
 
    width: 200px; 
 
    height: 100px; 
 
    background: white; 
 
    box-shadow: inset 8px 9px 3px -5px #939393; 
 
} 
 
body { 
 
    background: papayawhip; 
 
}
<div></div>

1

예. @antyrat에 언급 된 바와 같이 삽입 상자 그림자를 사용할 수 있습니다.

body { 
 
    background: #bada55; 
 
} 
 
.shadow { 
 
    width: 250px; 
 
    height: 250px; 
 
    margin: 25px auto; 
 
    background: white; 
 
    box-shadow: inset 3px 3px 3px grey; 
 
}
<div class="shadow"></div>

지원 - CanIUse.com