하나의 div에 둥근 모서리와 그림자가 적용 되었습니까?

Question

어떻게? CSS 외에 어떤 제안?

JQuery (dropCurves, shadow, shadedborder, corner osv)를 시도했습니다.

Answer 1

일반적인 옵션의 배열 : 반올림과 그림자 모두

1. 를 사용하여 배경 이미지를 적용하고 모서리를 둥글게 만들 div의 일련의.
2. CSS3 테두리 반경 및 상자 그림자를 사용합니다. (FF3.5 +, Safari 4+ 및 Chrome 2 이상에서는 안정적입니다.)
3. 점진적으로 더 작은 div (계단식으로 반올림하여 반올림)를 만들고 자바 스크립트를 사용하여 반올림을 추가합니다.

CSS3, 배경 이미지가있는 일반 CSS, 자바 스크립트 기술의 순서대로 진행됩니다.

대부분의 자바 스크립트 코너 라운딩 기술은 # 1에 대한 바로 가기 (CSS로 배경 이미지 적용)입니다. 그러므로 반올림을 추가하는 것을 사용하고 그림자를 추가하는 두 번째 것은 작동하지 않습니다. 그들은 결국 상충되는 상태로 끝나고 마지막으로 실행되는 것은 중 하나만 적용됩니다.

Answer 2

하나의 div에서 여러 가지 문제가 발생하는 경우 두 플러그인이 서로 자주 끊어지는 문제가 있습니다. 예를 들어, 이미지에 적용된 둥근 모서리를 가진 div는 자동으로 그림자를 그릴 수 없습니다. div의 실제 테두리가 둥근 모서리를 지나치므로. 내가 신뢰할만한 작업을 한 유일한 옵션은 full CSS3와 dropshadow와 둥근 모서리가 내장 된 단일 배경 이미지입니다.