css 정사각형 이미지 아래 둥근 그림자 만들기

이미지와 같은 정사각형 이미지 아래에 둥근 그림자 효과를 만드는 방법이 있습니까?css 정사각형 이미지 아래 둥근 그림자 만들기

이 종류의 효과가 가능하다고 말하는 this website도보고 있었지만 코드 구현에 대한 설명은 실제로 모호합니다.

enter image description here

2012-12-27 Human

이 jQuery를 그림자와 가능성 만이다 : http://syddev.com/jquery.shadow/ 이 CSS3와 possibitlies은 다음과 같습니다 http://nicolasgallagher.com/css-drop-shadows -without-images/demo/ –

페이지의 출처를 봅니다. –

이미지에 'Raised'상자 그림자 효과를 구현하는 방법을 설명해 주실 수 있습니까? 나는 그들의 코드가 따르기 힘들 기 때문에 이것을 묻는다. 감사합니다 – Human

나는 내가 그것을 알아 냈다고 생각합니다. 기본적으로 Box Shadow의 spread 속성을 사용하여 연관된 폭보다 작은 폭을 축소했습니다. 그것은이 코드에서 네 번째 픽셀 요소입니다 : 나는 얼마나 많은 그림자가 보여주는데 만족 될 때까지

box-shadow: 0px 30px 40px -25px rgba(0, 0, 0, 1);

내가 다음 아래로 수직으로 그림자를 이동했다.

Demo Here

출처

2012-12-27 22:12:23 Human

'-webkit-box-shadow'도 잊지 마세요. http://www.prowebdesign.ro/round-brush-like-responsive-drop-shadows-with-css3-and-no-images/ –

2014 참고 : -webkit-box-shadow는 더 이상 사용되지 않습니다. 단순히 상자 그림자를 사용하십시오. – BAR

css 정사각형 이미지 아래 둥근 그림자 만들기

답변

관련 문제