下の画像に示すように、ボックス シャドウ効果を実現したいと考えています。
box-shadowただし、css3プロパティは使用したくありません。(これは、phonegap android アプリケーションを構築しており、使用時に遅延の問題があるためですbox-shadow。)
上の画像に示すように、画像やその他の手法を使用して div スタイリングを作成する方法を教えてもらえますか。私は CSS の専門家ではないので、コードは非常に役に立ちます。
情報:
上記の div をレンダリングする css3 コードは次のとおりです。
.drop-shadow {
position: relative;
float: left;
width: 40%;
padding: 1em;
margin: 2em 10px 4em;
background: white;
-webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
-moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
}