4面すべてにボックスシャドウを適用するにはどうすればいいですか？

私はすべての側面にbox-shadowを適用しようとしています。私は唯一の2辺にそれを得ることができます：4面すべてにボックスシャドウを適用するにはどうすればいいですか？

2011-04-09 dragonfly

CSS3please.comは、この種のものに常に役立ちます。 – sscirrus

それが原因でオフセットxとyのです。

-webkit-box-shadow: 0 0 10px #fff; 
     box-shadow: 0 0 10px #fff;

編集（一年後...）：コメントで要求されるように、答えよりクロスブラウザメイド:)ところで

：多くのCSS3ジェネレータは、今日がある。.. css3.me、css3makerこれを試してみてください、css3generator等...

出典

2011-04-09 22:04:15 Damb

+1は、より小さい半径と広がりの値でより良く見えますが、正しい答えが速くなるためです。 – thirtydot

ありがとうございます。私はあなたの最初の答えを見て、私は間違った質問を得たと思った： – Damb

あなたはあなたの答えをより多くのクロスブラウザにする必要があります。 – think123

参照：http://jsfiddle.net/thirtydot/cMNX2/8/

input { 
    -webkit-box-shadow: 0 0 5px 2px #fff; 
    -moz-box-shadow: 0 0 5px 2px #fff; 
    box-shadow: 0 0 5px 2px #fff; 
}

出典

2011-04-09 22:07:00 thirtydot

私は3値+色のボックスシャドウのそれぞれの値を知っています。この4つの値は何ですか？ – dragonfly

Read：https://developer.mozilla.org/En/CSS/Box-shadow - 具体的には、「拡散半径」です。 – thirtydot

フィドル作成者 - MVP。 – Terrance00

これはクールに見えます。

-moz-box-shadow: 0 0 5px #999; 
-webkit-box-shadow: 0 0 5px #999; 
box-shadow: 0 0 5px #999;

出典

2013-03-12 23:39:42

は本当にクールです。私のために働いた – touchchandra

私はhttp://css-tricks.com/forums/topic/how-to-add-shadows-on-all-4-sides-of-a-block-with-css/サイトを見つけました。このコードとして

.allSides 
{ 
    width:350px;height:200px; 
    border: solid 1px #555; 
    background-color: #eed; 
    box-shadow: 0 0 10px rgba(0,0,0,0.6); 
    -moz-box-shadow: 0 0 10px rgba(0,0,0,0.6); 
    -webkit-box-shadow: 0 0 10px rgba(0,0,0,0.6); 
    -o-box-shadow: 0 0 10px rgba(0,0,0,0.6); 
}

出典

2014-09-19 12:02:29 user3619130

それはこのサイトの他の答えとして適切ですが、あなたが努力しているとき、私はあなたの答えを投票しています。 – blueray

@AhmmadIsmailありがとう – user3619130

単なる：

box-shadow: 0px 0px 2px 2px black; /*any color you want*/

出典

2016-04-11 02:31:39 Pankskie

使用するすべての四辺にこのCSSコード：ボックスシャドウ：0PX 1ピクセル7px 0PX RGB（106、111、109）。

出典

2017-01-25 06:16:56

4面すべてにボックスシャドウを適用するにはどうすればいいですか？

答えて

関連する問題